vue环境的搭建

一、首先要安装nodejs ：

别去官网下，慢的要死，这是国内的什么版本都有。地址

这是我下载的。

然后就傻瓜式安装。

验证是否安装成功

二、node.js的环境变量的新建。 //我安装的路径是D:\developTools\nodejs

其实安装完node，就自动在path里增加环境变量，但是为了以后的本地部署项目，我们需要找到node.js的安装根目录，在当中新建“node_global”和"node_cache"两个文件夹。

1、启动cmd依次执行以下两条命令

npm config set prefix "D:\developTools\nodejs\node_global"
npm config set cache "D:\developTools\nodejs\node_cache"

2、设置环境变量：

说明：设置环境变量可以使得住任意目录下都可以使用cnpm、vue等命令，而不需要输入全路径
a)新增系统变量NODE_PATH：把变量值设置成D:\developTools\nodejs（这样就可以把后面全局安装的装到global里并且可以直接用命令使用。）
b)修改用户变量PATH：选中PATH，点击编辑，把%NODE_PATH%\node_global\bin;加到前面

三、安装淘宝的npm镜像
1、命令

npm config set registry https://registry.npm.taobao.org

2、验证命令

npm config get registry

如果返回https://registry.npm.taobao.org，说明镜像配置成功。
3、安装yarn
输入:

npm install -g yarn

再配置下源：

yarn config set registry https://registry.npm.taobao.org -g
yarn config set sass-binary-site http://npm.taobao.org/mirrors/node-sass -g

修改安装路径和缓存：

yarn config  set global-folder "D:\developTools\nodejs\node_global"
yarn config set cache-folder "D:\developTools\nodejs\node_cache"

即可安装yarn镜像，以后再用到npm的地方直接用yarn来代替就好了。

四、安装全局vue-cli脚手架

yarn global add @vue/cli

等待安装好了，在dos命令敲 vue -V 就可看到vue版本了

使用vue-cli创建模板项目

vue init webpack vue_demo

解释上面命令
webpack是最简单的vue一个模板
vue_demo是项目名称

接下来根据提示输入工程的信息

vue-router需要安装，新手可以选择不安装ESLint和所有测试工具，一下子学太多容易从入门到放弃

1 ? Project name vue_demo
2 ? Project description A Vue.js project
3 ? Author chiang
4 ? Vue build standalone
5 ? Install vue-router? Yes
6 ? Use ESLint to lint your code? No
7 ? Set up unit tests No
8 ? Setup e2e tests with Nightwatch? No
9 ? Should we run `npm install` for you after the project has been created? (recommended) npm

然后我们进入这个项目所在的地址，依次命令如下：

cd vue_demo
yarn install
yarn run dev（或者yarn start;npm run dev;npm start;）

有的项目依赖chromedriver或者node-sass可以用运行下面命令解决问题

//chromedriver
yarn add chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver
//node-sass
yarn add node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/

vue环境的搭建

推荐阅读