vue.js 入門學習筆記一
編程工具：VS code
前言：本文介紹了Vue的一些基礎必備知識，如項目的標準目錄解析，以及使用node.js集成的npm下載live-server服務運行Vue項目。以一個hello world帶你入門Vue
1、先下載Vue.js 官網鏈接
tip：開發版本通常是在項目開發過程中使用，包含了完整的警告和調式模式，因此方便開發時進行調試。生產版本通常是在項目上線的時候使用，替換開發版本。
2、創建Vue項目及其目錄結構
2.1 新建一個vue文件將其拖進vs code左側資源管理器中
2.2 在Vue目錄下創建如下文件目錄，並將vue.js放進js文件夾
tip：assets文件夾下通常還會建css和js兩個文件夾用來存放項目的css樣式表和js文件，而assets在Linux和Unix下是不編譯的，因此這裏就加快了項目編譯的速度。example文件夾通常用來存放HTML文件。index.html則相當於項目入口。
3、在index文件中添加如下代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>hello world</title>
<script type="text/javascript" src="../assets/js/vue.js"></script>
</head>
<body>
<h1>hello world!</h1>
<hr>
<div id="app">
{{mes}}
</div>
<script type="text/javascript">
var app = new Vue({
el:"#app",
data:{
mes :'hell world!'
}
})
</script>
</body>
</html>
tip:新建index.html時沒有快速生成HTML模塊代碼時，只需要在編程界面輸入!（感嘆號），按下tab鍵就能生成HTML默認代碼。
4、安裝node.js
運行Vue項目需要使用npm或者cnpm下載live-server，這裏你可以單獨去安裝npm或者cnpm，但是我建議還是安裝node.js，最新的node.js已經集成了npm，node.js是搞前端開發必須懂的。
tip：npm /cnpm是一種包管理工具。npm是服務器在國外，下載速度較慢，cnpm是淘寶鏡像，速度快。
4.1 在官網下載node.js並安裝 官網鏈接
安裝完之後可以在cmd檢測是否安裝成功，看到版本號即爲成功
node -v
5、回到vs code 打開終端 安裝下載live-server。如下：
npm install -g live-server
6、啓動live-server
在vs code終端輸入如下代碼：
live-server
沒有意外的話會打開你的默認瀏覽器，顯示你的index.html頁面，如下
tip：我是有意外的那個，我輸入 live-server 後提示如下錯誤，提示我“禁止遠行腳本”
解決辦法如下：
打開PowerShell輸入如下代碼即可：
（不要粘貼註釋進去）
//檢查是否被禁用，回覆Restricted即爲被禁用
get-ExecutionPolicy
//開啓
set-ExecutionPolicy RemoteSigned
//輸入上面一句會提示你是否執行，輸入y即可
執行完之後回到vs code終端重新執行live-server即可成功自動跳轉頁面
補充：
通常新建一個項目後還會先初始化一下項目，寫一下配置文件，寫完之後會在項目根目錄自動生成一個package.json文件。代碼如下：
（執行這句代碼時先停掉live-server服務）
npm init
執行這句代碼會提示你輸入一些配置信息，如項目名、git倉庫、關鍵字、作者等。按照提示填寫即可。