
1. build: 构建脚本目录
1) build.js ==> 生产环境构建脚本
2) check-version.js ==> 检查npm, node.js版本
3) utils.js ==> 构建相关工具方法
4) vue-loader.conf.js ==> 配置了css加载器以及编译css之后自动添加前缀
5) webpack.base.conf.js ==> webpack配置环境
6) webpack.dev.conf.js ==> webpack开发环境配置
7) webpack.prod.conf.js ==> webpack生产环境配置
2. config: 项目配置
1) dev.env.js ==> 开发环境变量
2) index.js ==> 项目配置文件
3) prod.env.js ==> 生产环境变量
3. node_modules: npm 加载的项目依赖模块
使用该命令,将package.json安装所需要的组件放在生成的node_modules文件夹中
4. src: 开发目录
这里是我们要开发的目录,基本上要做的事情都在这个目录里。里面包含了几个目录及文件:
1) assets: 资源目录,放置一些图片或公共js、公共css。这里的资源会被webpack构建;
2) components: 组件目录,我们写的组件就放在这个目录里面;
3) router: 前端路由,我们需要配置的路由路径写在index.js里面;
4) App.vue: 根组件;
5) main.js: 入口js文件;
5. static
静态资源目录,如字体、图片等。不会被webpack构建
6. index.html
首页入口文件,可以添加一些meta信息等
7. package.json
npm包配置文件,定义了项目的npm脚本、依赖包等信息 (包含less依赖)
8. README.md
项目的说明文档,markdown格式
9. .xxxx
文件
这些是一些配置文件,包括语法配置、git配置等
10. webpack
webpack是一个前端资源加载/打包工具。
它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。