node創建Vue項目步驟詳解

vue的安裝

Vue.js不支持IE8及以下版本。因為Vue.js使用了ECMAScript5特性，IE8顯然不能模擬。

Vue.js支持所有兼容ECMAScript5的瀏覽器。

在用Vue.js構建大型應用時，推薦使用npm安裝，npm能很好的和webpack等打包工具配合使用。

首先Vue的安裝依賴于node.js，要保證你的計算機上已經安裝過node.js。

如何查看node是否安裝或者node版本呢？
進入cmd，輸入命令 node -v，回車查看。node最好使用新一些的版本，否則后續安裝會提示node版本過低

如果是安裝過node,則會顯示node的版本，否則就會提示不是內部或外部命令，這時候需要自行去node官網下載 
并安裝

1，安裝vue

npm install vue

安裝完畢后，可以檢驗版本。

vue -V

到此vue安裝成功

創建一個vue項目

1，全局安裝 vue-cli

npm install --global vue-cli

2 , 創建一個基于webpack 模板的新項目

vue init webpack new-project

輸入上面命令后，會詢問幾個選項，根據自己需要填寫就可以了。

Project name :項目名稱，如果不需要就直接回車。注：此處項目名不能使用大寫。

Project description:項目描述，直接回車

Author ：作者

vue build 構建方式（暫且這么解釋）

兩個選擇（上下箭頭選擇，回車即為選定）

1.Runtime + Compiler:recommended for most users

(譯：運行+編譯：被推薦給大多數用戶)

2.Runtime-only:about 6KB lighter min+gzip,but templates (or any Vue-specific HTML) are ONLY 

allowed in .vue files-render functions are required elsewhere

(譯：只運行大約6KB比較輕量的壓縮文件，但只允許模板（或任何VUE特定HTML）。VUE文件需要在其他地方呈現函數。翻譯不精準，意思大概是選擇該構建方式對文件大小有要求)

這里推薦使用1選項，適合大多數用戶的

install vue-router？是否安裝vue的路由插件，需要就選y，否則就n（以下均遵循此方法）

Use ESLint to lint your code?是否使用ESLint檢測你的代碼？

（ESLint 是一個語法規則和代碼風格的檢查工具，可以用來保證寫出語法正確、風格統一的代碼。）

Pick an ESLint preset:選擇分支風格

選項有三個

1. standard(https://github.com/feross/standard) js的標準風格
2. Airbnb(https://github.com/airbnb/javascript) JavaScript最合理的方法，這個github地址說是JavaScript最合理的方法
3. none (configure it yourself) 自己配置
   

Setup unit tests? 是否安裝單元測試（暫不詳細介紹）

Pick a test runner 選擇一個單元測試運行器

選項有三個

1. Jest（Jest是由Facebook發布的開源的、基于Jasmine的JavaScript單元測試框架）
2. Karma and Mocha
3. none

Setup e2e tests with Nightwatch(Y/n)?是否安裝E2E測試框架NightWatch（E2E，也就是End To End，就是所謂的“用戶真實場景”。）

Should we run 'npm install' for you after the project has been created?(譯：項目創建后是否要為你運行“npm install”?這里選擇包管理工具)

選項有三個

1. yes,use npm(使用npm)
2. yes,use yarn(使用yarn)
3. no,I will handle that myself(自己操作)
   

一路回車到此等待安裝完畢，會提示接下來的命令行

 3，安裝依賴

進入項目

cd new-project

安裝

npm install

4,啟動項目

npm run dev

這時候在瀏覽器中打開cmd上顯示的地址就可以看到新建的頁面。

http://localhost:8081

但是這個只能在本地跑，要如何在我們自己的服務器上訪問呢？ 此時需要執行： ·

npm run build

到此這篇關于node創建Vue項目步驟詳解的文章就介紹到這了,更多相關node創建一個Vue項目內容請搜索億速云以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持億速云！