Vue安装及环境配置
一、安装node.js官网:Download | Node.js历史版本:Previous Releases | Node.js或者下载完毕后,可以安装node,建议不要安装在系统盘(如C:)。二、设置nodejs prefix(全局)和cache(缓存)路径1、建议安装的路径不要有中文2、新建node_global和node_cache两个文件夹可以在nodejs安装路径下,新建3、设置缓存文件
一、安装node.js
历史版本:Previous Releases | Node.js
或者
下载完毕后,可以安装node,建议不要安装在系统盘(如C:)。
二、设置nodejs prefix(全局)和cache(缓存)路径
1、建议安装的路径不要有中文
2、新建node_global和node_cache两个文件夹
可以在nodejs安装路径下,新建
3、设置缓存文件夹
npm config set cache "E:\node\node_cache"
4、设置全局模块存放路径
npm config set prefix "E:\node\node_global"
设置成功后,之后用命令npm install XXX -g安装以后模块就在E:\node\node_global里
还可以输入npm list -global
命令来查看全局安装目录:
三、node.js环境配置
“我的电脑”-右键-“属性”-“高级系统设置”-“高级”-“环境变量”,进入环境变量对话框
1、【系统变量】下新建【NODE_PATH】,输入的内容根据实际来【D:\node\node_global\node_modules 】
2、【系统变量】下的【Path】添加上node的路径【D:\node_global】
四、配置淘宝镜像源
基于 Node.js 安装cnpm(淘宝镜像)
将npm的模块下载仓库从默认的国外站点改为国内的站点,这样下载模块的速度才能比较快,现在用的都是淘宝镜像源(https://registry.npm.taobao.org),使用淘宝镜像源有两种方式:
安装cnpm:
npm install -g cnpm --registry=https://registry.npm.taobao.org
验证方式变成了cnpm config get registry
或 cnpm config list
如图所示
直接修改npm的默认配置:
npm config set registry https://registry.npm.taobao.org
配置后可以根据 npm config get registry
或 npm config list
命令查看npm下载源是否配置成功
第二种临时使用:
npm --registry https://registry.npm.taobao.org install cluster
这个代码就是只在安装cluster的使用淘宝镜像下载,每次安装一个模块都用挺长的代码,比较繁琐,所以推荐第一种方式。
五、安装Vue及脚手架
安装vue.js
cnpm install vue -g
或者
npm install vue -g
查看安装的vue信息:npm info vue
或者cnpm info vue
查看安装的vue版本npm list vue
安装脚手架vue-cli
cnpm install -g @vue/cli
输入vue ui进入界面 (vue ui打开其网址)
其他补充
安装webpack模板
在命令行中运行命令 npm install webpack -g ,然后等待安装完成。
webpack 4x以上,webpack将命令相关的内容都放到了webpack-cli,
所以还需要安装webpack-cli:npm install --global webpack-cli,
安装成功后可使用webpack -v查看版本号。
顺手安装上vue-router
npm install -g vue-router
更多推荐
所有评论(0)