安装node js并构建一个vue

1、安装node js

下载node

2、安装完成后，运行cmd（用node -v查看安装版本）

3、安装npm（由于现在版本的nodejs已经集成npm所以无需安装，用npm -v 查看版本）

4、注册cnpm来代替npm

使用命令：npm install cnpm -g --registry=https://registry.npm.taobao.org
　　如果你发现你安装成功了，使用cnpm却发现找不到命令，那么就是你的环境变量有问题

设置环境变量：

一、node配置新方法( 以windows为例 )

    .npmrc位置 C:/Users/[username]/.npmrc
    在node安装目录创建/nodejs/node_global、/nodejs/node_cache两个文件夹存放全局包
    本例node安装目录D:/node
    本例成功后全局包安装的包目录D:/node/nodejs/node_global/lib/node_modules

1.node安装目录

安装node到[D:/node]下

2. 修改默认的全局目录
方法一： 到node安装目录[D:/node]执行以下命令：

    查看当前路径指令：npm config ls
    npm config set prefix D:/node/nodejs/node_global/ //全局包目录，就在node安装目录新建了个nodejs文件夹存放
    npm config set cache D:/ndoe/nodejs/node_cache/  //全局包缓存目录，就在node安装目录新建了个nodejs文件夹存放

方法二

直接修改C:/Users/[username]/.npmrc文件的cache值和prefix值，文件如下：

    prefix=D:\node\nodejs\node_global
    cache=D:\node\nodejs\node_cache
    registry=https://registry.npm.taobao.org/123

3.配置环境变量

计算机->属性->高级系统配置->环境变量->用户变量->编辑path,添加`global“目录如下：

 PATH: D:\node\nodejs\node_global\

总结：
不需要添加系统环境变量NODE_PATH，只需编辑用户环境变量
包安装统一到node安装包目录，便于管理查询
只需修改.npmrc一个文件
之前path可能会产生影响，不生效请删除原环境path中node相关内容，尝试重启机器

5、安装vue脚手架vue-cli

命令：cnpm install -g vue-cli
　　
　　其中：install -g中的-g指的是安装到全局目录下
　　安装成功后可以用 vue -V 查看vue版本

6、cd到对应的目录下初始化vue项目

命令：cnpm init webpack my-project

　　　　　　Project name 项目名 
　　　　　　Project description 项目名描述 
　　　　　　Author 作者邮箱 
　　　　　　Use ESLint to lint your code? 是否需要ESlist语法检查 
　　　　　　Setup unit tests with Karma + Mocha? 是否需要单元测试 
　　　　　　Setup e2e tests with Nightwatch? Yes是否需要e2e测试 

7、package.json为项目依赖资源，如果要运行这个项目需要使用cnpm install 安装依赖项（直接在项目文件夹路径下执行）

8、使用命令cnpm run dev启动项目，浏览器会打开 http://localhost:8080/#/ 看到以下效果

开发时属于热部署状态，代码保存后浏览器会自动刷新，错误提示也非常友好。

9、编译打包 cnpm run build

会编译打包到项目dist文件夹下，然后我们就可以部署到服务器上（注意：如果你直接打开index.html，可能页面会是一片空白，这是由于你引用的js路径有问题）

10、使用jQuery包

http://www.cnblogs.com/pandabunny/p/5417938.html

转载于：https://www.cnblogs.com/wanglu/p/7062081.html