程序亦非猿

Vue-cli脚手架搭建

2018/05/18 Share

安装:

注意:请确保 node 版本为 4.x、5.x 及以上

1、只限于 Linux 版本,首先我们先全局安装一下

$ npm i -g vue-cli

2、全局安装完之后,我们执行

$ vue list

这是查看 vue 给我们提供的脚手架的版本,有很多,我用的就是 webpack

3、选择我们用要使用的版本

$ vue init webpack test-exercise

这是安装我们要使用的版本 webpack 后面跟的是我们的项目名称

所有模板默认安装的是 Vue 2.x 版本,如果需要安装 1.x 版本,需要输入如下指令:

$ vue init webpack#1.0 test-exercise

4、进入项目中,然后把看我们 package.json 文件里面有很多依赖,这些依赖有开发环境的,还有生产环境的依赖,是项目中需要的,所以我们需要执行以下命令

$ npm i

命令执行完之后会生成一个 node_modules 文件这个文件就是我们项目中所用到的所有插件的文件

5、然后我们该把项目运行一下,执行以下命令

$ npm run dev

这个命令是在 package.json 文件 “scripts” 配置的,”scripts”是一个对象,里面配置的就是我们要执行的命令,因为命令太长,所以给缩写了,然后运行,你也可以自己改这些命令

6、我们也可以打包看一下,打包之后的文件,打包之后会生成一个 dist 文件,这个文件就是用 webpack 打包之后生成的文件,线上用的就是这个文件,这些都不用你去自己去配置,因为 vue-cli 脚手架已经帮我们配置好了,你直接在里面改就可以了,执行以下命令

$ npm run build

7、这个时候我们的项目就跑起来了

CATALOG
  1. 1. 安装: