重新開始,獨立完成 Vue 項目
準備工作
Node.js、Vue官方文檔、ES6
項目構建
直接使用 Vue 官方提供的腳手架(Vue-cli),所以第一步首先是安裝腳手架。在命令行或者 Webstorm 的 Terminal 窗口中輸入以下命令即可自動安裝:
npm i -g vue-cli(全局安裝之後,下次可以直接使用,不需要再次安裝)
安裝完成之後,初始化應用的目錄
vue init webpack app(app爲項目的根目錄)
回車之後會有幾個初始化的選項需要你選擇:
- 項目名、描述、作者,直接回車即可
- vue build 選項,與配置相關的,直接回車即可
- 是否安裝vue-router,後面一般都會用到,所以推薦輸入y
- 語法檢查、單元測試、項目測試,直接輸n即可
- 項目創建之後是否 npm install ,選擇Yes
回車之後,會自動生成項目結構和安裝各種依賴文件。
下載之後輸入 npm init -y 初始化項目
之後,輸入 npm run dev 運行項目,稍等下完成後就能拿到URL地址,你可以在瀏覽器打開初始頁面。
到這裏,一個基礎的單頁應用就算是創建完成了。