vue脚手架、Vuex、axios的安装使用

一、安装Vue脚手架：

建立项目名

打开文件所在目录，在安装位置打开cmd
vue init webpack 文件名

初始化：

npm install
npm run dev
打开浏览器：localhost:8080  即可打开项目

打包文件 :

npm run build  
浏览器打开  dist中的index.html
修改config中index.js   '/' => './' 
npm run build

安装Vuex

cd 项目
npm install vuex --save 

二、Vuex的使用

1> . store/store.js 中：

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
let store = new Vuex.Store({
})
export default store

2>. main.js ------方法及数据

import store from './store/store.js'
new Vue({
  store,
  state:{},
  mutations:{},
  getters:{}
})

3> . App.vue ---------- 调用数值和方法

import store from './store/store.js'
export default{
    name: 'App',
    store,
    computed:{
        sum(){}
           return this.$toute.state.arr
        }
     },
     methods: {
         add(index){
             this.$toute.commit('add',index)
          }
    }
}

三、scss

安装

npm install node-sass --save-dev
npm install sass-loader --save-dev

引入scss：

<style lang='sass'>
@import 'header.scss'
</style>

四、axios

1、 安装

npm install axios  
npm install --save axios vue-axios

2、main.js 中：

import axios from 'axios'
import VueAxios from 'vue-axios' 
Vue.use(VueAxios, axios)

3 、组件中（以json对象为例）：

import axios from 'axios'
created() {
    Axios.get("../../static/data.json").then((res) => {
       console.log(res.data)
     })
 }