VUE web項目的安裝

1、安裝nodejs

2、參考網上教程http://www.runoob.com/vue2/vue-install.html，CMD下安裝VUE模塊

查看版本
$ npm -v

最新穩定版
$ cnpm install vue

全局安裝 vue-cli
cnpminstall–globalvue−cli創建一個基於webpack模板的新項目$cnpminstall–globalvue-cli創建一個基於webpack模板的新項目$ vue init webpack my-project
這裏需要進行一些配置，默認回車即可

cd my-project
npm install
npm run dev

3、路由設置
在src下新建一個page文件夾
在項目文件夾src/router/index.js

import Vue from 'vue'
import Router from 'vue-router'
import index from '@/page/index'   //對應page下index.vue
import content from '@/page/content' //對應page下content.vue

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'index',
      component: index
    },
    {
      path: '/content',
      name: 'content',
      component: content
    }
  ]
})

4、page文件夾下的實體運行文件（一定要帶style標籤）
index.vue

<template>
   <div>index page</div>
</template>

<style>
</style>

5、運行
關閉eslint報警，煩人的編寫格式，空格不對就要報錯
build文件下webpack.base.conf.js 註釋掉以下語句

const createLintingRule = () => ({
 // test: /\.(js|vue)$/,
  //loader: 'eslint-loader',
 // enforce: 'pre',
 // include: [resolve('src'), resolve('test')],
  //options: {
 //   formatter: require('eslint-friendly-formatter'),
  //  emitWarning: !config.dev.showEslintErrorsInOverlay
 // }
})

npm run dev

http://localhost:8080/#/content

6、項目打包
npm run build
打包後，拷貝工程文件夾下的static裏所有文件到Tomcat裏，只能放web根目錄，路徑問題待找方法