vue命令工具的安装

官网

https://github.com/vuejs/vue-cli

#最新版本确认
$ npm show vue-cli
#安装
$ npm install -g [email protected]
#安装版本确认
$ npm -V
#命令帮助
$ vue -h

vue-cli命令选项

• init 初始化Project

• list 当前可用的模板

• build 组件打包发布

• help [cmd]

$ vue help init
Usage: vue-init <template-name> [project-name]

Options:
  -c, --clone  use git clone
  --offline    use cached template
  -h, --help   output usage information
  Examples:

    # create a new project with an official template(默认)
    $ vue init webpack my-project

    # create a new project straight from a github template(自定义)
    # GitHub用户名+子项目名+你的工程名
    $ vue init username/repo my-project

各种项目模板

vue命令默认提供的各种模板(6个)

$ vue list

  Available official templates:

  ★  browserify - A full-featured Browserify + vueify setup with hot-reload, linting & unit testing.
  ★  browserify-simple - A simple Browserify + vueify setup for quick prototyping.
  ★  pwa - PWA template for vue-cli based on the webpack template
  ★  simple - The simplest possible Vue setup in a single HTML file
  ★  webpack - A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.
  ★  webpack-simple - A simple Webpack + vue-loader setup for quick prototyping.

模板官网

https://github.com/vuejs-templates

webpack模板工程

• 建立webpack模板工程

官网

http://vuejs-templates.github.io/webpack/

$ vue init webpack myweb
$ cd myweb
$ npm run dev
$ npm run build

webpack工程

• src：源文件文件夹

• dist：打包文件夹

• package.json：项目设置文件

可能出现问题的解决方法

• https://blog.csdn.net/qq_24349695/article/details/90514900

• https://blog.csdn.net/qq_24349695/article/details/90637548

  Vue进阶系列说明：本系列仅仅作为Vue进阶视频的归纳总结与记录，在此感谢小马视频ORYouTube地址