目錄結構 ├── README.md 項目介紹 ├── index.html 入口頁面 ├── build 構建腳本目錄 │ ├── build-server.js 運行本地構建服務器,可以訪問構建后的頁面 │ ├── build.js 生產環境構建腳本 │ ├── dev-client.js 開發服務器熱重載腳本,主要用來實現開發階段的頁面自動刷新 │ ├── dev-server.js 運行本地開發服務器 │ ├── utils.js 構建相關工具方法 │ ├── webpack.base.conf.js wabpack基礎配置 │ ├── webpack.dev.conf.js wabpack開發環境配置 │ └── webpack.prod.conf.js wabpack生產環境配置 ├── config 項目配置 │ ├── dev.env.js 開發環境變量 │ ├── index.js 項目配置文件 │ ├── prod.env.js 生產環境變量 │ └── test.env.js 測試環境變量 ├── mock mock數據目錄 │ └── hello.js ├── package.json npm包配置文件,里面定義了項目的npm腳本,依賴包等信息 ├── src 源碼目錄 │ ├── main.js 入口js文件 │ ├── app.vue 根組件 │ ├── components 公共組件目錄 │ │ └── title.vue │ ├── assets 資源目錄,這里的資源會被wabpack構建 │ │ └── images │ │ └── logo.png │ ├── routes 前端路由 │ │ └── index.js │ ├── store 應用級數據(state) │ │ └── index.js │ └── views 頁面目錄 │ ├── static 純靜態資源,不會被wabpack構建。 └── test 測試文件目錄(unit&e2e) └── unit 單元測試 ├── index.js 入口腳本 ├── karma.conf.js karma配置文件 └── specs 單測case目錄 └── Hello.spec.js
vue組件命名規范
單文件組件的文件名應該要么始終是單詞大寫開頭 (PascalCase),要么始終是橫線連接 (kebab-case)。
在views文件夾下新建三個文件 home-page.vue和not-found.vue,login.vue,signup.vue,文件夾user,article,invest