cli-vue

admin

Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供：

• 通过 @vue/cli 实现的交互式的项目脚手架。
• 通过 @vue/cli + @vue/cli-service-global 实现的零配置原型开发。
• 一个运行时依赖 (@vue/cli-service)，该依赖：
  
  • 可升级；
  • 基于 webpack 构建，并带有合理的默认配置；
  • 可以通过项目内的配置文件进行配置；
  • 可以通过插件进行扩展。
    
• 一个丰富的官方插件集合，集成了前端生态中最好的工具。
• 一套完全图形化的创建和管理 Vue.js 项目的用户界面。
  

Vue CLI 致力于将 Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接，这样你可以专注在撰写应用上，而不必花好几天去纠结配置的问题。与此同时，它也为每个工具提供了调整配置的灵活性，无需 eject。

官方文档:https://cli.vuejs.org/zh/guide/

安装环境:

[C++] 纯文本查看 复制代码

npm install -g @vue/cli
npm install -g @vue/cli-init

验证安装是否成功

[C++] 纯文本查看 复制代码

vue --version

创建项目:

[C++] 纯文本查看 复制代码

vue init webpack myapp

注意:
在配置创建项目时，如果启用了ESlint 语法检查，那么你必须严格遵循他的语法限制。
其中包括JS 语句结尾无法使用分号符号，函数名后面必须加空格等等，
约束性极强，开发效率低  由于JS 没有分号换行，代码维护能力大幅度下降  。因此不推荐启用该选项

[C++] 纯文本查看 复制代码

### 12.3 语法检查

注意 ：如果我们在 构建项目时 选择了 `Use ESLint to lint your code` 那么我们在写代码时必须严格遵守 [JavaScript Standard Style]([url=https://standardjs.com/]https://standardjs.com/[/url]) 代码风格的语法规则：

- **使用两个空格** – 进行缩进
- **字符串使用单引号** – 需要转义的地方除外
- **不再有冗余的变量** – 这是导致 _大量_ bug 的源头!
- **无分号** – [这]([url=http://blog.izs.me/post/2353458699/an-open-letter-to-javascript-leaders-regarding]http://blog.izs.me/post/23534586 ... t-leaders-regarding[/url])[没什么不好。]([url=http://inimino.org/~inimino/blog/javascript_semicolons]http://inimino.org/~inimino/blog/javascript_semicolons[/url])[不骗你！]([url=https://www.youtube.com/watch?v=gsfbh17Ax9I]https://www.youtube.com/watch?v=gsfbh17Ax9I[/url])
- 行首不要以 `(`, `[`, or ``` 开头
  - 这是省略分号时**唯一**会造成问题的地方 – _工具里已加了自动检测！_
  - [详情]([url=https://github.com/standard/standard/blob/master/docs/RULES-zhcn.md#semicolons]https://github.com/standard/stan ... -zhcn.md#semicolons[/url])
- **关键字后加空格** `if (condition) { ... }`
- **函数名后加空格** `function name (arg) { ... }`
- 坚持使用全等 `===` 摒弃 `==` 一但在需要检查 `null || undefined` 时可以使用 `obj == null`。
- 一定要处理 Node.js 中错误回调传递进来的 `err` 参数。
- 使用浏览器全局变量时加上 `window` 前缀 – `document` 和 `navigator` 除外
  - 避免无意中使用到了这些命名看上去很普通的全局变量， `open`, `length`, `event` 还有 `name`。



说了那么多，看看[这个遵循了 Standard 规范的示例文件]([url=https://github.com/expressjs/body-parser/blob/master/index.js]https://github.com/expressjs/body-parser/blob/master/index.js[/url]) 中的代码吧。或者，这里还有[一大波使用了此规范的项目]([url=https://raw.githubusercontent.com/standard/standard-packages/master/all.json]https://raw.githubusercontent.co ... ges/master/all.json[/url]) 代码可供参考。



> 注意: 如果你不适应这些语法规则,可以在构建项目时不使用 ESLint 的语法检查

项目的启动：

[C++] 纯文本查看 复制代码

  cd myapp
  npm run dev