安装vue-cli

node.js

1.1 node.js下载
node.js官网:https://nodejs.org/en/
安装vue-cli
1.2node.js安装
安装过程一路next,在选择存储路径时,尽量选取本地保存环境的路径。
在系统变量path中加入一行记录 C:\Program Files\nodejs(自己存储路径) 就行。切记每次配置了都要重新打开cmd,不要用之前的窗口检测 node -v
1.3 验证安装
用管理员身份打开cmd,命令行输入

node -v
npm -v   

安装vue-cli
安装成功

1.4 安装淘宝镜像

npm在国内的速度有时很慢,安装淘宝的镜像可以很大提升下载速度,但是尽量少使用cnpm下载,打包时有可能出现错误

npm install cnpm -g 

安装vue-cli
安装成功

2.安装Vue-Cli脚手架

安装node总是出现这个问题,cpnm不是内部命令,见图
安装vue-cli
根据提示找到cnpm的文件位置:将cnpm和cnpm.cmd拷贝到你安装的node的文件夹中,
安装vue-cli
安装vue-cli
又出现了这个错误,注意标红区域,就将\node_modules\文件夹中的cnpm文件拷贝到node里的同名文件夹下,就成了,
安装vue-cli
安装vue-cli

安装Vue-Cli

cnpm install vue-cli -g

安装vue-cli
安装成功

vue list验证是否成功
安装vue-cli
将vue.cmd 路径加入Path用户环境变量中(不建议加入系统环境变量,加入哪个都可以)。如我的路径是C:\Users\DSX\AppData\Roaming\npm,重新打开cmd(管理员身份)
安装vue-cli

创建Vue-Cli程序

使用命令行cmd,进入到自己的代码位置E:\idea_for_workspace\学习\vue三刷

vue init webpack myvue-01

全部选择no即可
安装vue-cli

项目运行

cd myvue-01
npm install
npm run dev

npm install
安装vue-cli
npm run dev
安装vue-cli
浏览器访问: http://localhost:8080/
安装vue-cli
浏览器访问后想要停止服务,可以在cmd窗口ctrl+c
安装vue-cli

使用IDE打开创建的项目

安装vue-cli
在Terminal中报错不要怕,因为不是管理员权限
安装vue-cli

更改启动idea权限

右键idea属性
安装vue-cli
右键idea64.exe属性
安装vue-cli

上一篇:Windows搭建VUE环境


下一篇:npx create-react-app my-app+webpack打包运行项目