1.准备工作

安装Vue

2.开始

1.vue init webpack my-project

会提示，1.说包名，注意小写

                2.说包描述

                3.作者

                4.是否需要路由：选择是

                5.其余全部点否

VUE搭建完毕

2.安装vuex

1.npm install vuex

然后 在src文件目录下新建一个名为store的文件夹，为方便引入并在store文件夹里新建一个index.js,里面的内容如下:

impor tVue from 'vue';

import Vuex from 'vuex';

Vue.use(Vuex);

conststore =newVuex.Store();

export default store;

接下来，在 main.js里面引入store，然后再全局注入一下，这样一来就可以在任何一个组件里面使用this.$store了：

importstorefrom'./store'//引入store

new Vue({ 

 el:'#app', 

 router,

 store,//使用store

template:'<App/>', 

 components: { App }

})

Vuex安装完毕

3.安装Element UI

1.npm i element-ui-S

在 main.js 中写入以下内容：

import ElementUI from 'element-ui';

import 'element-ui/lib/theme-chalk/index.css';

import App from './App.vue';

Vue.use(ElementUI);

安装完毕

4.安装jquery

npm install jquery

安装完毕

在build/webpack.base.conf文件当中引入jquery

module.exports= {  

...  resolve: {    extensions: ['.js','.vue','.json'],  

  alias: {

'vue$':'vue/dist/vue.esm.js',

'@': resolve('src'),

'jquery': path.resolve(__dirname,'../node_modules/jquery/src/jquery')  

 }  },  ...}

import $ from 'jquery' 

export default{ 

name:'hello',

 data () {

return{

msg:'Welcome to Your Vue.js App'

}

 },

mounted:function(){

lettest = $('#test').text()console.log(test) 

 },

methods:{  }

}

5.安装less

npm install less less-loader --save

main.js 全局引入

var Less = require('Less');

在组件中

<style scoped lang="less">

    @width: 100%;

    @height: 100px;

    @color: red;

  .container{

   width: @width;

   height: @height;

   background-color: @color;

   margin-bottom: 5px;

   };

</style>

安装完毕

6.安装axios

 npm install axios

 cnpm install axios //taobao源

在main.js引入
import axios from 'axios'

Vue.prototype.$axios =axios

安装完毕