一、npm、nodejs安装
1、安装Node.js
官网下载Node.js
双击下载文件,选择安装路径,安装。
#cmd下查看安装完后的版本
node -v
npm -v
2、配置npm的全局模块的存放路径以及缓存的路径
默认会将模块安装到C:\Users\用户名\AppData\Roaming\npm路径中。所以可以修改路径
在node.js的安装目录下新建两个文件夹node-cache和node_global
#创建目录
d:
mkdir software
cd software
mkdir Nodejs
cd Nodejs
mkdir node_global
mkdir node_cache
#设置缓存的路径,之后用npm install XXX -g安装以后模块就在这两个文件夹里。
npm config set prefix "D:\\software\\Nodejs\\node_global"
npm config set cache "D:\\software\\Nodejs\\node_cache"
3、安装cnpm
有些npm有些资源被屏蔽或者是国外资源的原因,经常会导致用npm安装依赖包的时候失败,所以还需要npm的国内镜像—cnpm
npm install -g cpm
4、安装vue-cli脚手架
npm install -g vue-cli
cnpm install -g @vue/cli
5、安装webpack
cnpm install -g webpack
6、用vue-cli构建项目
#初始化项目
vue init webpack my-first-vue
nit:初始化
webpack:构建工具,即整个项目基于webpack构建
MyVue:整个项目文件夹的名称
#运行项目
cd my-first-vue
npm run dev
二、npm源设置
#设置淘宝源
npm config set registry [<https://registry.npm.taobao.org>](<https://registry.npm.taobao.org/>)
#查看源地址
npm config get registry
#测试源
npm info underscore
#在命令行中指定源
npm --registry <https://registry.npm.taobao.org> install [name]
#修改~/.npmrc
registry = <https://registry.npm.taobao.org>
#使用cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install [name]
三、VScode设置
3.1、vscode语言设置
按下ctrl+p, 输入: > Config, 选择: “Configure Display Language"
3.2、安装vuetr插件
3.3、安装eslint插件(eslint:此时打开一个vue文件并编辑, 保存时并不会自动进行格式化, 这里还需要安装一些依赖和一些配置。)
3.3.1、vue安装:npm install -g eslint
3.3.2、vscode安装eslint插件