卸载脚手架 -g 表示全局卸载 global 全局的意思
npm uninstall @vue/cli -g全局安装脚手架 并指定版本 4.5.13
npm install -g @vue/cli@4.5.13查看 版本 脚手架版本
vue -V 或者 vue --version查看vue命令的帮助 会提示你如何使用 脚手架命令
vue-
脚手架 也可以使用 图形化界面管理工具 下去自己了解
vue ui
-
利用cli 创建vue 项目 注意创建项目的路径
vue create 项目名称
- 7.1 方向键选中版本 vue2 还是vue3 还是自己手动配置
- 7.2 手动配置 可以自己定制个性化的 vue项目
-
使用 cli 4.5.13 和5.0.4 项目目录是有区别的
- 4.5.13 没有 vue.config.js 配置项 给隐藏了
- 4.5.13 没有 js.config.json 配置项
启动 cli 项目 npm run serve 注意项目的路径 你先cd到项目目录下
启动成功后 然后 访问 http://localhost:8080/ cli 默认会生成一个helloword 单文件
查看 package.json 可以查找 项目如何启动
"scripts": {
"serve": "vue-cli-service serve", // 启动项目交
"build": "vue-cli-service build", // 打包项目
"lint": "vue-cli-service lint" // 语法检查
},
- 不同版本的vue
- 在cli 中使用的vue 是阉割版 之前我们都是完整版的
- 完整版的vue.js 有大约1/3 都是模板解析器
- cli中使用的是 vue.runtime.xxx.js 为运行版 只有核心
- 运行版没有模板解析器 所以要借助 rander函数
大家可以在模块包中的vue 去查看 不同的vue版本
可以通过 配置 vue.config.js 来自己定制 个性化vue
关闭语法检查 在vue.config.js 中配置
module.exports = {
// 关闭语法检查
lintOnSave:false
};
- 快速生成单文件模板快捷键 <v 回车即可 安装插件 vetur