其他分享
首页 > 其他分享> > vue-cli2.0过渡到 vue-cli3.0配置和使用

vue-cli2.0过渡到 vue-cli3.0配置和使用

作者:互联网

vue-cli2.0过渡到 vue-cli3.0配置和使用

为了避免vue-cli2.0版本对3.0版本造成影响,需要先卸载全局安装的2.0版本

一、卸载vue-cli2.0

卸载分两种情况:

1.安装nodejs时,是否在nodejs目录下手动新建了node_cache和node_global文件夹,同时配置了与之相关的环境变量;

这种情况,你只需要把这两个文件夹删掉,然后再新建两个名字一样的空文件夹
在这里插入图片描述

2.默认路径

这种情况,你只需要找到npm 和npm-cache文件夹,删掉即可;

路径:C:\Users\你的用户名\AppData\Roaming
在这里插入图片描述


二、vue-cli3.0配置和使用

1、由于把之前全局安装的模块都删掉了,咱们需要重新配置一下镜像提高拉包速度
npm install cnpm -g -registry=https://registry.npm.taobao.org

测试是否安装成功:

cnpm -v
2、全局安装 vue-cli3.0
cnpm install -g @vue/cli@3.3.0 
3.安装完毕,我们开始手动创建项目

创建一个myapp的项目文件夹

vue create myapp

点击键盘下方向键,选择Manually select features手动配置;回车
在这里插入图片描述
点击方向键,移动到想安装的模块,按空格键选中,可多选;回车
在这里插入图片描述
使用 路由模式history,输入:y;回车
在这里插入图片描述
选择预处理 Sass/SCSS;回车
在这里插入图片描述
选择语法检查(Standard标准):移动方向键,选中ESLint + Stanard config;回车
在这里插入图片描述
选择语法检查模块(2);移动方向键,按空格键选中,可多选;回车
在这里插入图片描述
选择各模块存为单独的页面:移动方向键,选中in dedicated config files ;回车
在这里插入图片描述
是否存配置记录(N):输入N;回车
在这里插入图片描述
在这里插入图片描述
Ctrl + C回到当前目录,然后执行如下命令

#进入myapp目录下
cd myapp
#开发环境构建
cnpm run serve

在这里插入图片描述
生产环境搭建

cnpm run build

在这里插入图片描述
代码检测工具

cnpm run lint

在这里插入图片描述


vue-cli3.0版本的配置到这里就结束了

注:这是属于菜鸟的简单配置,正在努力爬阶中

勤劳一日,可得一夜安眠;勤劳一生,可得幸福长眠。——达·芬奇

标签:文件夹,方向键,cnpm,cli3.0,vue,cli2.0,回车
来源: https://blog.csdn.net/weixin_41967475/article/details/106276523