从 vue-cli 开始
搭建一个 vue 项目最简单的方式就是使用官方的脚手架工具,他提供了现代前端工作流的构建设置,只需要几分钟时间就可以运行带有 热更新
Eslint
打包
功能的项目。
vue-cli 的安装比较简单,基本上跟着官网的步骤就可以
安装
前提条件: Node.js 版本在 6.x 以上, npm 版本在 3 以上, 并且要已经安装了 git
npm install -g vue-cli
用法
vue init <template-name> <product-name>
例子:
vue init webpack my-project
上面的命令将会从 vuejs-template/webpack
上面拉取 基于 webpack
配置的 vue
模版。
vue-cli 官方提供为 vue 应用几种零配置的开发模版,这些模版里自动生成了应用的目录、初始的代码、项目的配置,能够让用户更快的搭建 vue 项目。
当前官方提供的模版包括:
webpack
功能齐全的webpack
+ vue-loader
的设置、热重载、eslint、test 和 css 提取。
webpack-simple
一个快速设置简单的 webpack
+ vue-loader
原型的模版。
browserify
功能齐全的 browserify
+ ‘vueify’设置与热重负荷,linting和单元测试。
browserify-simple
快速设置简单的 browserify
+ ‘vueify’ 原型。
pwa
基于webpack的vue-cli 的单页面模版。
simple
对 html
的简单 vue 配置 。
同时也是支持自定义模版的,夜里就不赘述了,以后有时间研究一下这个。
运行
cd project-name
npm run dev
在之前的版本,项目初始化之后还需要进入目录运行
npm install
安装这种以来,现在 在vue init
的时候已经为我们安装好了各种依赖