1.安裝node

2.安裝git（需要在碼雲配置好公鑰，新建倉庫，下載到本地）

3.安裝vue-cli（cmd中輸入npm install -g vue-cli）

4.webpack初始化專案（git bash here中輸入:vue init webpack 資料夾名）- -資料夾名可以不同，但都必須是小寫，不能出現大寫字母。

5.安裝sass前處理器（git bash here中輸入:npm install -g sass。）

步驟一：

如果報錯可能是因為版本過高，可以進行如下操作：

npm uninstall --save sass-loader // 解除安裝

npm i -D [email protected]//

npm uninstall --save node-sass // 解除安裝

npm install --save-dev node-sass// 安裝

步驟二：

開啟build資料夾下的webpack.base.conf.js

找到module.exports裡的module，在rules裡新增下面的配置：

{ test: /\.sass$/, loaders: ['style', 'css', 'sass'] }

步驟三：

樣式標籤更改為：

<style lang="scss">

6.安裝elementUi：（git bash here中輸入:npm i element-ui -S

在 main.js 中寫入以下內容：

import ElementUI from 'element-ui';

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

Vue.use(ElementUI);

7.安裝vuex：（git bash here中輸入:npm install vuex --save)

8.安裝echarts：（git bash here中輸入: git bash here中輸入: npm install cnpm -g 然後cnpm install echarts --save)

在main.js 中寫入以下內容：

import * as echarts from "echarts";

Vue.prototype.$echarts = echarts;

9.安裝data-v視覺化大屏元件庫：（npm install @jiaminghi/data-view)

在main.js 中寫入以下內容：

import dataV from '@jiaminghi/data-view'

Vue.use(dataV)

10.vscode中安裝的外掛：

Vue 外掛：Vetur；

Element 外掛：vscode-element-helper；

程式碼格式化外掛：Prettier；

程式碼檢測外掛：ESLint；

拼寫檢測外掛：Code Spell Checker；

正則外掛：any-rule；

11.安裝js-cookie外掛（git bash here中輸入:npm install js-cookie --save)

引用：importCookies from'js-cookie'

12.tinymce:http://tinymce.ax-z.cn/

13.程式碼初始化（meta配置，border.css/reset.css，fastclick，stylus-loader）