1. vue create vue04創(chuàng)建一個vue04；如果沒有網(wǎng)絡(luò)怎么辦？在有網(wǎng)絡(luò)的情況下，先打包vue04，如果沒有網(wǎng)絡(luò)又想創(chuàng)建新的項(xiàng)目，就解壓縮，就可以運(yùn)行了

2. vue04

3. 創(chuàng)建后，進(jìn)入vue04，再運(yùn)行npm run serve

4. 了解npm run serve的執(zhí)行順序

--> 1. 讀取package.json 【script】

--> 2. 讀取serve, 通過腳手架啟動項(xiàng)目"vue-cli-service serve"

--> 3. 訪問路徑：

--> 4. 運(yùn)行入口程序 （src-->main.js）

--> 看main.js

4.1. 讀取的是node_modules下面的vue, 里面有源碼

4.2. 后綴名是vue的模板，App.vue模板（有：界面template, 腳本script， style樣式）

4.3. 產(chǎn)品提示是否關(guān)閉 （阻止生產(chǎn)消息）

4.4. 開啟產(chǎn)品提示來觀察下

 4.5. webpack: 2種模式

development mdoe 開發(fā)模式（更多的調(diào)試性）

production mode 產(chǎn)品模式（更好的性能）

 提醒你發(fā)布的時候，要改為產(chǎn)品模式，即改為false

5. 代碼: 創(chuàng)建vue對象（ViewModel），掛載到index.html中的app div (如果把public里面的index.html中div的id修改了，頁面就報錯了，說明是掛載到這里)

 界面---數(shù)據(jù)模型---橋梁搭建起來 new Vue

來認(rèn)識下這段代碼

const app = new Vue({
  router,
  data: {
    name: '小明'
  },
  render: h => h(App)
});


app.$mount('#app');
console.log(app);

console: 

同：

const app = new Vue({
  router,
  el: '#app',
  data: {
    name: '小明'
  },
  render: h => h(App)
});


app.$mount('#app');//$mount掛載，注銷掉一樣
console.log(app);

如果注釋掉render函數(shù)，會報錯

（要么一個預(yù)編譯的模板中在render函數(shù)中，要么編譯包含在里面，否則模板編譯器不能用）

理解：render: h => h(App) （就是包含了一個預(yù)編譯模板）

6. 加載預(yù)編譯模板App.vue文件 （包含界面template, 腳本script， style樣式，看4.2正好引入了，后面就是加載了這個預(yù)編譯文件）, 并且傳入render函數(shù)，進(jìn)行渲染

7. 看起來的效果，就像是App.vue就是根層入口

8. 

9. 創(chuàng)建vue05, 安裝router和vuex

src-->main.js-->多了router和store（store勾選vuex后產(chǎn)生的）