第一个vue运行

1，代码

我刚入手，所以直接在网上d的模板，用的element，

地址如下：

演示地址：http://blog.gdfengshuo.com/example/work/

代码仓库：https://github.com/lin-xin/vue-manage-system

 

2，vue搭建环境

vue需要nodejs支持，需要用到npm（npm的作用就是对Node.js依赖的包进行管理）。

新版本安装的时候，nodejs会将其一起安装上。

1)下载nodejs，地址：https://nodejs.org/en/download/

一般用LTS，稳定版本

2)安装完以后可以尝试用命令装x一下。

测试下版本：node -v 回车，npm -v 回车

3)npm安装依赖包，用淘宝NPM镜像比较快。

命令如下：npm install -g cnpm --registry=http://registry.npm.taobao.org

安装完以后再测一下版本，cnpm -v回车

4)安装vue-cli。

vue-cli是一种全局脚手架用于帮助搭建所需的模板框架，同理在cmd中输入命令:npm install -g vue-cli。在这一段代码中-g是为了全局使用的意思。与cnpm样，安装完成后会显示一长串的文件，输入 vue -v可以查看vue版本。此时，环境已经基本搭建成功。

 

3，代码配置

把github下载的vue-manage-system-master.zip解压，cmd命令打开对应的文件夹，

我直接放到个人的文件夹下了，然后cd运行，接下来直接npm run dev报错了，原因是没引用依赖包，需要提前安装一下。

直接输入：npm install，然后等待安装。

之后 刚才解压的文件夹下会出现 node_modules 文件夹，是命令安装的依赖项。

然后输入 npm run dev 运行程序。

等出现如上提示，则直接在浏览器输入  http://localhost:8080  即可打开站点。

 

 

 

后续：关于vue站点的发布，

在压缩包的目录下，用命令 npm run build 即可，会在目录里面生成dist文件，直接到iis、tomcat等发布即可。注意，直接打开会报错，因为index.html里面的js引用的路径问题。