Vue项目目录结构解析

2020-07-28

Vue项目目录结构解析

9.png

build 项目构建（webpack）相关代码

config 配置目录，包括端口号等，其下的index.js在部署发布前需要修改assetsPublicPath: '/' 成 assetsPublicPath: './'（一般有两个地方要替换）

**src ** 做开发的目录其下包含

​ assets(放置图片，logo等)，

​ components(放组件文件，可以不用)，

​ App.vue(项目入口文件，可将组件写在这个文件中，不使用component目录)，

​ main.js(项目的核心文件)

static 静态资源目录，入图片，字体等

node_modules npm加载项目依赖的模块 （执行npm install之后产生改目录）

dist 项目打包后产生的目录（执行npm run build后产生，里面包含index.html和static）

test 初始测试目录，可删除，正式项目不存在改目录

index.html 首页入口文件

package.json 项目配置文件，说明项目依赖模块

README.md 项目说明文档

修改页面内容一般在 .vue 文件里修改