项目结构

.
├── build/                      # webpack 配置文件
│   └── ...
├── config/
│   ├── index.js                # 主要的项目配置
│   └── ...
├── src/
│   ├── main.js                 # app 入口文件
│   ├── App.vue                 # main app 组件
│   ├── components/             # ui组件
│   │   └── ...
│   └── assets/                 # 模块资源(由webpack进行处理)
│       └── ...
├── static/                     # 纯静态资源 (直接拷贝)
├── test/
│   └── unit/                   # 单元测试
│   │   ├── specs/              # 测试规格文件
│   │   ├── index.js            # 测试构建入口文件
│   │   └── karma.conf.js       # 测试运行器配置文件
│   └── e2e/                    # e2e测试
│   │   ├── specs/              # 测试规格文件
│   │   ├── custom-assertions/  # e2e测试的自定义断言
│   │   ├── runner.js           # 测试运行器脚本
│   │   └── nightwatch.conf.js  # 测试运行器配置文件
├── .babelrc                    # babel配置
├── .postcssrc.js               # postcss 配置
├── .eslintrc.js                # eslint 配置
├── .editorconfig               # editor 配置
├── index.html                  # index.html 模板
└── package.json                # 构建脚本和依赖

build/

该目录包含了开发环境和生产环境的webpack构建配置。通常你不需要改动这些文件,如果想要自定义Webpack loaders,可以查看build/webpack.base.conf.js这个文件。

config/index.js

该文件暴露出了一些最通用的构建安装配置选项,是主要配置文件。更多细节请查看开发环境API Proxying后端框架集成

src/

你的应用的大多数代码都应该放在这里。至于里面的文件结构是什么样的,还需要你自己好好策划一下。如果你正在使用Vuex,可以参考vuex示例项目里的结构Vuex应用推荐

static/

这里放的是那些你不想让Webpack接管的文件。它们会被直接拷贝到webpack构建assets所生成的路径下面。

查看 处理静态资源获取更多细节。

test/unit

包含单元测试相关的文件。查看 单元测试 获取更多细节。

test/e2e

包含e2e测试相关的文件。查看 e2e测试 获取更多细节。

index.html

这就是我们单页面应用的模板 index.html文件。在开发和构建过程中,Webpack会生成静态资源,并且引用这些静态资源的URL会被自动地添加到这个模板里,渲染出最终的HTML。

package.json

NPM打包元文件,包含所有的构建依赖和构建指令.

results matching ""

    No results matching ""