## 簡要說明

- `main.js`主入口，`router.js`路由劃分
- `plugins` 自己或第三方外掛,包括但不限於components、directives、filters、third lib
- `pages` 所有路由頁面。原則：輕page，重component
- `components` 所有元件。包括原子元件、業務公用元件、頁面獨有元件
- `server` api引入入口
- `assets` sass、圖片資源入口，不常修改資料
- `utils` 工具資料夾
- `store` 標準vuex格式，非必須

## [#](https://lq782655835.github.io/blogs/team-standard/recommend-vue-project-structure.html#詳細說明)詳細說明

```text
project
└───src
│ │ app.vue // 主頁面
│ │ main.js // 主入口
| | router.js // 所有路由
│ │
│ |____assets // css、image、svg等資源
│ | |____css // 所有sass資源
| | | | reset.scss // 相容各瀏覽器
| | | | global.scss // 全域性css
| | | | variable.scss // sass變數和function等
│ | |____img // image圖示庫
| | |____svg // svg圖示庫
| |
| |____components // 元件
│ | |____common // common自注冊元件
│ | |____base // 原子元件(如果是引入第三方，該資料夾可省略)
│ | | ... // 業務公用元件
│ | |____entity // entity頁面元件
│ | |____about // about頁面元件
| |
| |____pages // UI層(原則：輕page，重component)
| | |____entity
| | | | list.vue // 列表頁
| | | | create.vue // 新增頁
| | | | edit.vue // 修改頁
| | | main.vue
| |
| |____plugins // 自己或第三方外掛
| | | index.js // 外掛入口檔案
| | | directives.js // 所有Vue指令
| | | filters.js // 所有Vue過濾
| |
| |____server // 介面層
| | | index.js // 所有介面
| | | http.js // axios二次封裝
| |
| |____store // vuex資料
| | | index.js
| |
| |____utils // 工具層
| | | config.js// 配置檔案，包括常量配置
|
└───public // 公用檔案，不經過webpack處理
│ │ favicon.ico
│ │ index.html
│ vue.config.js // vue-cli3主配置
│ babel.config.js// babel配置
│ .eslintrc.js // eslint配置
│ .prettierrc.js // perttier配置
│ package.json // npm配置
│ README.md // 專案說明

```