Vue 2.0 開發環境 - 以 webpack2 建立

Transcript

1. Vue2.0 樄咳絑ह 犥 webpack 2 ୌ缏 1 styleMe䨝捍ਰ 2017/2/3 julian
2. Vue2.0 • 硬አ Virtual-DOM • Server-side Rendering • 硬虋膏ीےӞ犚ኞ޸蝰๗獢ୗ • 殾ဳ఺物زկ犋胼䟑斉ک <body> or <html> 2 https://vuefe.cn/v2/guide/instance.html
3. ୌ缏䌕礯 • VUE-CLI • 犥 webpack 2.2.0 ᛔᤈୌ缏 3
4. webpack 2.X • module.loaders is now module.rules • loader 殾ےӤ -loader 盅翖 • ࣁक़䍅蟴ᗝጱ硬ک rules ex. postcss-loader • ES6 Modules 4 https://webpack.js.org/guides/migrating/
5. 奲կ玕 • ֵአ vue-loader 膏 .vue 䲆 5
6. Hot Reload • webpack-dev-server • vue-hot-reload-api • ୌ缏Ӟඪ server.js 6 webpack.config.js package.json https://github.com/andyyou/vue-dinner-demo/blob/master/build/server.js
7. 樄咳瞲犤 • 樄咳 webpack-dev-server • ୌ缏 webpack -p • ے獈 npm-script 7
8. vue-router • ڡত玕ොୗ硬虋 8 v1 v2 https://cn.vuejs.org/v2/guide/migration-vue-router.html#router-redirect-磦ഘ
9. vue-router • ीےৼ᪠ኧ • view ጱ v-link 硬౮ router-link 9 v1 v2
10. ࣁ gulp 䌕礯Ӿ蝝疩獈 • gulp-webpack 10
11. ஞ஑ • Vue ਻ฃӤಋ牧֕獋㮆粚๜舙䷱矑藉螂 v1 Ӟ樄ত䨝 磪讨窾㫂 • Vue migration helper 11
12. Vue migration helper • npm install --global git://github.com/vuejs/vue- migration-helper.git • cd vue-project • Vue-migration-helper 12 http://kuro.tw/posts/2016/09/30/Vue-2-0-%E5%8D%87%E7%B4%9A%E5%B0%8F%E5%B9%AB%E6%89%8B-Vue-migration-helper/
13. 㷢ᘍ虻碘 13 Migrating from v1 to v2 https://webpack.js.org/guides/migrating/ vue + webpack 蚏ಋୗ https://webpack.js.org/guides/migrating/ webpack ᪡ࣗԏ碟 https://webpack.js.org/guides/migrating/ ՗ Vue Router 0.7.x 鉐ᑏ https://cn.vuejs.org/v2/guide/migration-vue-router.html