【VUE】Mac下vue 開發環境搭建,以及目錄結構
阿新 • • 發佈:2018-12-03
1 安裝Node.js
參看 node.js環境安裝
http://www.cnblogs.com/richerdyoung/p/7265786.html
2 安裝淘寶映象
sudo npm install -g cnpm --registry=https://registry.npm.taobao.org
如果出現:Unexpected end of JSON input while parsing near *** 等錯誤執行:npm cache clean --force(清除快取)
3 安裝全域性vue-cli腳手架,用於幫助搭建所需的模板框架
sudo cnpm install -g vue-cli
輸入:vue,回車,若出現vue資訊說明表示成功
4 切換到你的專案目錄
cd desktop/vue
5 新建vue專案
vue init webpack vuetest
6 一路回車(第4步ESLint 可以一路n,大師請忽略n)
進入新建專案
cd vuetest
cnpm install
npm run dev
目錄結構
- main.js 是我們的入口檔案,主要作用是初始化vue例項並使用需要的外掛
- App.vue是我們的主元件,所有頁面都是在App.vue下進行切換的。其實你也可以理解為所有的路由也是App.vue的子元件。所以我將router標示為App.vue的子元件。
- index.html檔案入口
- src放置元件和入口檔案
- node_modules為依賴的模組
- config中配置了路徑埠值等
- build中配置了
- webpack的基本配置、開發環境配置、生產環境配置等