vue项目搭建随记

工具介绍

• npm

            NPM的全称是Node Package Manager ，是一个NodeJS包管理和分发工具，已经成为了非官方的发布Node模块(包)的标准。有了NPM，能够很快的找到特定服务要使用的包，进行下载、安装以及管理已经安装的包。

• vue-cli

            至关于脚手架，经过官方模板能够帮你自动生成模板工程

            安装：npm install -g vue-cli

            详见：http://webpackdoc.com/

• webpack

            Webpack 是当下最热门的前端资源模块化管理和打包工具。它能够将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源。还能够将按需加载的模块进行代码分隔，等到实际须要的时候再异步加载。经过 loader 的转换，任何形式的资源均可以视做模块，好比 CommonJs 模块、 AMD 模块、 ES6 模块、CSS、图片、 JSON、Coffeescript、 LESS 等。

            安装：npm install webpack -g

            详见：http://webpackdoc.com/

 

项目搭建

• vue init webpack my-vue

            

            经过官方模板生成项目my-veu

• npm install

            安装依赖

• npm run dev

            启动项目，该命令会将项目编译到内存，并不会生成build文件

• npm run build           

            生成build文件

 

经常使用插件安装命令

•  element-ui ：基于 Vue 2.0 的组件库

            安装：npm i element-ui@next -save

             详见： http://element.eleme.io/#/

•   vue-router 2 ： vue路由插件 支持单页应用

              安装：npm install vue-router -save

               详见：http://router.vuejs.org/zh-cn/installation.html

•    vue-resource ： 与后端数据交互

               安装：npm install vue-resource -save

                详见：http://www.cnblogs.com/keepfool/p/5657065.html