使用 Vue 開發(fā)單頁應(yīng)用全攻略
網(wǎng)上面有很多關(guān)于如何使用 Vue 開發(fā)單頁應(yīng)用的教程切厘，從 Vue-cli 的使用到 Vue router 的配，也是非常的詳細(xì)童谒。但是卻沒有對各個需要的知識點做擴展，再加上技術(shù)的更新?lián)Q代也是幾何倍的，所以現(xiàn)在決定寫一系列關(guān)于如何從頭開發(fā) Vue 單頁應(yīng)用的攻略宽菜，希望對各大熱愛學(xué)習(xí)的朋友有所幫助，同時如果寫的有什么不對的地方希望指正竿报。謝謝铅乡。
一、知識儲備
EcmaScript 6
ECMAScript 6.0（以下簡稱 ES6）是 JavaScript 語言的下一代標(biāo) 準(zhǔn)烈菌，已經(jīng)在2015年6月正式發(fā)布了阵幸。它的目標(biāo)，是使得 JavaScript 語言可以用來編寫復(fù)雜的大型應(yīng)用程序芽世，成為企業(yè)級開發(fā)語言挚赊。
ES6 相對于它以前的版本可謂是突飛猛進(jìn)，新增了塊作用域捂襟、箭頭函數(shù)咬腕、Class欢峰、Promise葬荷、Module 以及 N 多的新特征和語法。而且不需要擔(dān)心不同瀏覽器對 ES6 的兼容性問題纽帖，你可以放心的使用 Babel 或 TypeScript 來處理各種問題宠漩。
學(xué)習(xí) ES6 語法中比較常用的部分推薦看如下文章：
學(xué)習(xí) ES6 的全部特征推薦阮一峰開源的書籍
Sass
Sass 是一款強化 CSS 的輔助工具，它在 CSS 語法的基礎(chǔ)上增加了變量 (variables)懊直、嵌套 (nested rules)扒吁、混合 (mixins)、導(dǎo)入 (inline imports) 等高級功能室囊，這些拓展令 CSS 更加強大與優(yōu)雅雕崩。使用 Sass 以及 Sass 的樣式庫（如 Compass）有助于更好地組織管理樣式文件，以及更高效地開發(fā)項目融撞。
Sass 能夠使你像開發(fā)真正的計算機語言般開發(fā)你的 CSS盼铁。什么，你想將常用的 CSS 封裝成一個函數(shù)尝偎，或者繼承上一個 CSS 的樣式饶火？沒問題鹏控，使用 Sass 就可以解決了。當(dāng)然肤寝，同樣優(yōu)秀的還有 Less 和 Stylus当辐，這里不做討論。
Sass 官網(wǎng)：
二鲤看、開始使用腳手架
使用 Webpack 搭建過項目的人肯定知道缘揪，光是 webpack.config.js 和 package.json 的配置就非常的復(fù)雜了，更別提其他的各種文件了义桂。感謝 Vue-cli 使這一切變得非常的簡單寺晌，接下來介紹一下如何使用 Vue-cli 搭建開發(fā)環(huán)境。
- 全局安裝 vue-cli
cnpm install -g vue-cli
- 初始化 Vue 項目
vue init webpack my-project
- 進(jìn)入 my-project
