文件目录.md 3.1 KB

项目结构

  • build 打包配置文件夹,项目构建(webpack)相关代码。
  • config 配置目录,包括端口号等。
    • index.js 请求前域名的配置。
  • node_modules 用于存放我们项目的各种依赖,比如axios等,没有moudles文件,项目就没法运行,可以使用 npm install进行项目依赖的安装。
  • public 是一个模板文件,作用是生成项目的入口文件,webpack打包的js,css也会自动注入到该页面中。我们浏览器访问项目的时候就会默认打开生成好的index.html。
  • src 我们存放各种vue文件的地方。
    • assets 存放静态资源地,放置一些图片,如logo等。
    • components 全局的公用组件存放位置。
    • config 配置请求拦截器,同一处理报错方式。
    • lib 全局的公用组件存放位置。
    • store 是一个全局的共享数据库存储区域,就相当于是一个数据仓库。
    • utils 自己编写的全局js工具文件夹。
    • views
  • static 静态html页面的css/js/img存放地,请勿轻易进行更改。
  • test 初始测试目录,本地测试类文件。
  • .editorconfig 定义和维护一致的编码样式。
  • .eslintignore 当 ESLint 运行时,在确定哪些文件要检测之前,它会在当前工作目录中查找一个 .eslintignore 文件。如果发现了这个文件,当遍历目录时,将会应用这些偏好设置。一次只有一个 .eslintignore 文件会被使用,所以,不是当前工作目录下的 .eslintignore 文件将不会被用到(eslint通过.eslintignore 文件或者在 package.json 文件中查找 eslintIgnore 键,来检查要忽略的文件)。
  • .eslintrc.js js语法检测配置。
  • .gitignore git上传需要忽略的文件格式。
  • index.html 是一个模板文件,作用是生成项目的入口文件,webpack打包的js,css也会自动注入到该页面中。我们浏览器访问项目的时候就会默认打开生成好的index.html。
  • nginx.conf 反向代理配置文件。
  • package-lock.json 在 npm install时候生成一份文件,用以记录当前状态下实际安装的各个npm package的具体来源和版本号(package.json文件只能锁定大版本,也就是版本号的第一位,并不能锁定后面的小版本,你每次npm install都是拉取的该大版本下的最新的版本,为了稳定性考虑我们几乎是不敢随意升级依赖包的,这将导致多出来很多工作量,测试/适配等,所以package-lock.json文件出来了,当你每次安装一个依赖的时候就锁定在你安装的这个版本。)。
  • package.json 定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)。npm install 命令根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。
  • vue.config.js 是一个可选的配置文件,如果项目的 (和 package.json 同级的) 根目录中存在这个文件,那么它会被 @vue/cli-service 自动加载。你也可以使用 package.json 中的 vue 字段,但是注意这种写法需要你严格遵照 JSON 的格式来写。