Vue 项目结构
打开我们昨天构建好的myapp 项目,我们会看到如下的目录结构:
下面我们分别来说明:
| 目录 | 子目录 | 说明 |
|---|---|---|
| build | webpack 配置文件 | |
| config | index.js | 主项目配置 |
| … | 其他配置 | |
| node_modules | node组件 | |
| src | assets |
|
| App.vue |
| |
| components |
| |
| router | 路由,负责页面跳转 | |
| main.js | 应用入口文件,主要作用是初始化vue实例及需要的插件 | |
| static | 应用静态资源 | |
| test | 测试文件 | |
| .babelrc | babel 配置([babel](https://www.babeljs.cn/) 是Javascript编译器) | |
| .editorconfig | 编辑器配置文件 | |
| .eslintignore | eslint 忽率规则 | |
| .gitignore | gitignore的默认配置 | |
| .postcssrc.js | postcss 配置 | |
| index.html | 应用页面模板 | |
| package.json | 构建应用脚本和依赖文件 | |
| README.md | 应用说明文件,MarkDown格式 | |
| webpack.config.js | 项目入口页面 |
附官方文档说明:
├── build/ # webpack config files
│ └── …
├── config/
│ ├── index.js # main project config
│ └── …
├── src/
│ ├── main.js # app entry file
│ ├── App.vue # main app component
│ ├── components/ # ui components
│ │ └── …
│ └── assets/ # module assets (processed by webpack)
│ └── …
├── static/ # pure static assets (directly copied)
├── test/
│ └── unit/ # unit tests
│ │ ├── specs/ # test spec files
│ │ ├── eslintrc # config file for eslint with extra settings only for unit tests
│ │ ├── index.js # test build entry file
│ │ ├── jest.conf.js # Config file when using Jest for unit tests
│ │ └── karma.conf.js # test runner config file when using Karma for unit tests
│ │ ├── setup.js # file that runs before Jest runs your unit tests
│ └── e2e/ # e2e tests
│ │ ├── specs/ # test spec files
│ │ ├── custom-assertions/ # custom assertions for e2e tests
│ │ ├── runner.js # test runner script
│ │ └── nightwatch.conf.js # test runner config file
├── .babelrc # babel config
├── .editorconfig # indentation, spaces/tabs and similar settings for your editor
├── .eslintrc.js # eslint config
├── .eslintignore # eslint ignore rules
├── .gitignore # sensible defaults for gitignore
├── .postcssrc.js # postcss config
├── index.html # index.html template
├── package.json # build scripts and dependencies
└── README.md # Default README file
本文详细介绍了Vue项目的标准目录结构,包括各个子目录的功能及其包含的主要文件。从webpack配置到单元测试,帮助读者全面理解Vue项目的组织方式。
6619

被折叠的 条评论
为什么被折叠?



