vuecli创建vue3.0的项目
1. cnpm的安装
1.1安装淘宝镜像cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
测试:cnpm -v 如果有出现版本号证明安装成功
1.2为什么一定要安装cnpm
vue-cli3.0默认使用yarn包管理工具而不是原来的npm，而由于众所周知的原因，yarn中node-sass，如果你不*，默认下载极大可能会失败
我的解决方法就是: 不用默认的 我直接用cnpm 这样就不用*了
2. 安装@vue/cli 不是那个vue-cli
vue-cli 是vue2.0老版本的 创建方式的脚手架
但是vue3.0使用的是 @vue/cli 的包名 两个是不同的
2.1如果你的电脑上存在 vue-cli 你可以把他给卸载了
cnpm uninstall -g vue-cli
2.2下载新的@vue/cli
cnpm install -g @vue/cli
检查版本
vue -V
@vue/cli 4.5.13
检查版本
3. 项目创建的注意点
3.1进入项目创建的文件夹路径 创建好的项目将放到这个文件夹里面
vue create 项目名称
3.2配饰初始化
3.3选项的创建
3.4建议选择2.x3.5是否使用 历史路由 [就是路由 带不带#] 随意选择
3.6 css预处理器的下载 这样子 就能使用 scss less css预处理器
推荐使用 第一个 Sass/SCSS (with dart-sass)
这里面有个大坑 很多人都哭了
Sass/SCSS (with node-sass) 这个选项如果用默认的npm去下载 是需要*的 很多都下载失败 报出node-sass is not fund
''你可以csdn搜索一下—node-sass 报错 就知道了"
所以必须使用 cnpm去下载 这样 就不会*了
还有就是cnpm淘宝镜像 和npm 几乎是同步的 每隔几分钟会同步一次
所以不用担心你下载的包 不全面和原来的不一样
3.7代码规范
3.8模板创建
yes的话 会进入一个项目名称的界面 让你给模板起个名字
no的话 会直接去创建项目 不会保存这次的模板
3.9创建后 就可以运行了
4.项目和vue2.0的区别
4.1vue3.0的项目文件
4.2vue2.0
4.3对比
差别一:webpack 没了
vue3.0没有了 config的文件夹 这样webpack 去哪里配置呢
vue3.0 需要你手动创建vue.config.vue 进行配置
差别二:
很多的工具会自动的安装完成
vue3.0的package.json
里面好多的npm 包 的开发需求都安装好了
比如 router vuex 都不用在自己下载–创建 --配置了