一、模組化開發

1、 搭建開發環境

1. 全域性安裝webpack

npm install webpack -g

2. 全域性安裝vue腳手架

npm install -g @vue/cli-init
​
如果上面的不行使用 ： npm install -g vue-cli
​
//檢查是否安裝成功
vue -V （V必須大寫）

3. 初始化vue專案

// :vue腳手架使用webpack模組初始化一個appname專案
vue init webpack app的namevue

4. 啟動vue專案

專案中package.json中有scripts，代表我們執行的命令

cd vue-demo
npm start = npm run dev : 啟動專案
 

5. 輸入localhost:8081檢視

6. 用VSCode開啟腳手架專案vue-demo

1. 開啟資料夾，選擇腳手架專案的路徑
2. 在終端啟動專案 ： npm run dev

二、vue整合ElementUI進行快速開發

1、安裝ElementUI

npm i element-ui  (i是install簡寫)

2、在main.js檔案寫入以下內容

import Vue from 'vue';
import ElementUI from 'element-ui';
import 
 
'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';
​
Vue.use(ElementUI);
​
new Vue({
    el: '#app',
    render: h=>h(App)
});

以上程式碼便完成了ElementUI的引入，注意：樣式檔案需要單獨引入