vue-cli创建应用

vue创建项目

1.首先安装node

64 位安装包下载地址 :  https://nodejs.org/dist/v4.4.3/node-v4.4.3-x64.msi

一直next就ok

node - v

显示版本，则安装成功

2.安装vue-cli

npm install -g vue-cli

如果发生无法安装，请确认是否是权限不足。

如果是权限不足，请在内容前加上   sudo

sudo npm install -g vue-cli

3.创建应用

vue init webpack note

note是应用名

4.进入你的项目目录

也就是note目录下（具体情况是看你自己的安装目录）

5.安装vue的依赖包

npm install

6.启动vue服务

npm run dev

默认端口号是8080，如果占用请调换端口号

启动vue服务对node和npm是有版本要求的，如果是版本原因，不解释，直接更新到最新版本

对于npm，随便新建一个文件夹例如：F:\test。按着“shift”键，右键该文件夹，选择“在此处打开命令窗口（W）”，进入命令行，键入：npm i npm

最后将 npm文件夹拷贝到nodejs的安装目录中的node_modules文件夹下，直接覆盖原文件。

最后你可以查看npm的版本：npm -v

参考链接： http://www.cnblogs.com/du-blog/p/5958310.html

7.所有问题都解决了，运行成功，如图

8.现在运行你的项目

①打开命令行窗口，cmd回车

进入你的项目所在目录

例如我的是E:\soft\node\note

执行操作是：e:回车，cd soft回车，cd node回车，cd note回车

进入项目目录之后运行 npm run start ,开启服务，项目运行成功

②本地查看（每次修改都需要重新build）

之前步骤和①相同，最后一步替换成执行npm run build 开始打包代码

并在项目目录下生成dist文件，执行dist文件中的index.html即可

不过，在此之前，需要修改如图所示位置，原文件应是"/",改为"./"即可

然后，重新打包也就是运行npm run build，再次打开dist下的index.html，

发现项目运行成功。

附带一个小项目讲解

链接： https://juejin.im/post/58f4881da0bb9f006aa5c2a3

附带一个bootstrap.min.css的链接：<link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />