開始前爬了一些文，大大們都說vue.js輕鬆易學，去谷哥了一下在開始vue.js之前須要會什麼東西，因目前沒有實務操縱資料的經驗，以我的學習速度真的是很怕文章難產(不想拖累團隊阿淚奔....)，但如果現在不開始，那一輩子都有藉口不開始了R

然後就看到Vue作者寫的這篇-新手向：Vue 2.0 的建议学习顺序
擷取部分內容如下，想了解完整內容請去上面傳送門：

起步

1. 紮實的JavaScript / HTML / CSS 基本功。這是前置條件。
2. 通讀官方教程(guide)的基礎篇。不要用任何構建工具，就只用最簡單的，把教程裡的例子模仿一遍，理解用法。不推薦上來就直接用vue-cli構建項目，尤其是如果沒有Node/Webpack基礎。
3. 照著官網上的示例，自己想一些類似的例子，模仿著實現來練手，加深理解。
4. 閱讀官方教程進階篇的前半部分，到『自定義指令(Custom Directive) 』為止。著重理解Vue 的響應式機制和組件生命週期。『渲染函數（Render Function)』如果理解吃力可以先跳過。
5. 閱讀教程里關於路由和狀態管理的章節，然後根據需要學習vue-router 和vuex。同樣的，先不要管構建工具，以跟著文檔裡的例子理解用法為主。
6. 走完基礎文檔後，如果你對於基於Node 的前端工程化不熟悉，就需要補課了。下面這些嚴格來說並不是Vue 本身的內容，也不涵蓋所有的前端工程化知識，但對於大型的Vue 工程是前置條件，也是合格的『前端工程師』應當具備的知識。

看到第一項玻璃心都碎滿地惹 淚奔

好....看完這部分，我覺得我還是明年再來好了(喂，喔喔.....不是.....是一邊學習Vue一邊補足js基本觀念，雖然上面有些詞看不太懂例如前端工程化，然後看到後面Webpack就很害怕，但我不想半途而廢阿...QQ，那麼就從官方文件的安裝開始吧！(附上連結 官方文件安装 — Vue.js)

vue開發環境

下載後以script引入就可以了，這邊使用CDN引入：

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>

另外官方提供兩個版本：

各點開了開發版本及生產版本出來看，發現前者(開發)是vue.js後者(生產)是vue.min.js，文件上也提醒開發結束要上線的時候，要記得把開發時引用的vue.js替換為vue.min.js

如果是引入開發版本，專案開啟時在chrome-devtools會看到這樣：

• 如果沒有裝Vue Devtools擴充套件的話，就會出現第一則建議安裝的訊息，Vue Devtools是Vue提供的debug套件，之後用上會在後面文章做一些整理。
• 接著會有提示目前是開發者模式的訊息，也如同官方文件敘述，再次提醒開發者在部屬到正式環境時，確保引用的版本是生產版本。

為了印證官方文件說的壓縮版本會失去所有常見錯誤相關的警告，來亂測試看看：

<!-- html -->
<div id="app01" class="section">
    <input type="text" v-model="value">
    <br>
    {{value}}
</div>

<!-- js -->
<script>
new Vue({
      el: "#app01",
      // data: {
      //   value: "text",
      // },
      });
</script>

這邊把data註解掉之後，console如下：

生產版本：value is not defined

開發版本：value is not defined @#$~@%!~^$#~$@^%~@$^%!

對照下來開發版本的錯誤訊息明顯描述的比較詳細，至於還有其他沒瞭解到的細節或是錯誤的地方，懇請路過大大提點了，非常感謝