Vue-Shortkey 项目教程

Vue-Shortkey 项目教程

vue-shortkeyVue-ShortKey - The ultimate shortcut plugin to improve the UX项目地址:https://gitcode.com/gh_mirrors/vu/vue-shortkey

1. 项目的目录结构及介绍

Vue-Shortkey 项目的目录结构如下：

vue-shortkey/
├── dist/
│   ├── vue-shortkey.common.js
│   ├── vue-shortkey.esm.js
│   └── vue-shortkey.umd.js
├── src/
│   ├── index.js
│   ├── plugin.js
│   ├── directives/
│   │   └── shortkey.js
│   └── utils/
│       └── index.js
├── package.json
├── README.md
└── .gitignore

目录结构介绍

• dist/：包含编译后的文件，适用于不同的模块系统（CommonJS、ES Module、UMD）。
• src/：源代码目录。
  • index.js：项目的入口文件。
  • plugin.js：Vue 插件的实现。
  • directives/：包含自定义指令的实现。
    • shortkey.js：shortkey 指令的实现。
  • utils/：包含工具函数。
• package.json：项目的配置文件，包含依赖、脚本等信息。
• README.md：项目的说明文档。
• .gitignore：Git 忽略文件的配置。

2. 项目的启动文件介绍

项目的启动文件是 src/index.js，它负责导出 Vue 插件。

import Shortkey from './plugin'

export default Shortkey

这个文件导入了 plugin.js 中定义的插件，并将其默认导出，以便在其他项目中使用。

3. 项目的配置文件介绍

项目的配置文件是 package.json，它包含了项目的基本信息、依赖、脚本等。

{
  "name": "vue-shortkey",
  "version": "4.0.1",
  "description": "A plugin for VueJS 2.x that makes it easy to add shortcuts",
  "main": "dist/vue-shortkey.common.js",
  "module": "dist/vue-shortkey.esm.js",
  "unpkg": "dist/vue-shortkey.umd.js",
  "scripts": {
    "build": "rollup -c",
    "dev": "rollup -c -w",
    "test": "jest"
  },
  "dependencies": {
    "vue": "^2.6.10"
  },
  "devDependencies": {
    "@babel/core": "^7.4.5",
    "@babel/preset-env": "^7.4.5",
    "babel-jest": "^24.8.0",
    "jest": "^24.8.0",
    "rollup": "^1.15.6",
    "rollup-plugin-babel": "^4.3.3",
    "rollup-plugin-commonjs": "^10.0.1",
    "rollup-plugin-node-resolve": "^5.0.1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/fgr-araujo/vue-shortkey.git"
  },
  "keywords": [
    "vue",
    "shortkey",
    "shortcut",
    "keyboard"
  ],
  "author": "Fernando Gonçalves",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/fgr-araujo/vue-shortkey/issues"
  },
  "homepage": "https://github.com/fgr-araujo/vue-shortkey#readme"
}

配置文件介绍

• name：项目名称。
• version：项目版本。
• description：项目描述。
• main、module、unpkg：不同模块系统的入口文件。
• scripts：包含项目的构建、开发、测试等脚本。
• dependencies：项目运行时的依赖。
• devDependencies：开发时的依赖。
• repository：项目的 Git 仓库信息。
• keywords：项目的关键词。

vue-shortkeyVue-ShortKey - The ultimate shortcut plugin to improve the UX项目地址:https://gitcode.com/gh_mirrors/vu/vue-shortkey