Webpack 工程目录解析

目录结构

package.json

{
  "name": "webpack_environment",
  "version": "1.0.0",
  "description": "A webpack environment test",
  "author": "abzerolee",
  "scripts": {
    "dev": "node build/dev-server.js",
    "build": "node build/build.js"
  },
  "dependencies": {
    "nimble": "^0.0.2"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.22.1",
    "babel-loader": "^7.1.1",
    "babel-preset-stage-2": "^6.22.0",
    "webpack-merge": "^4.1.0"
  }
}

package.json 文件中不能有注释
dev 和 build 命令表明了开发和生产的入口文件
dependencies 为生产环境依赖
devDependencies 为开发环境依赖

node_modules

使用 npm install 指令回安装 package.json 中注明的依赖，其中的module 就安装到 node_modules 文件夹下。

[文件名].md

md 为 markdown 的缩写。即指标记语言编写的文档。例如 readme.md 介绍的就是项目的内容简介的一些API等等。

.[文件名]

一些你安装的依赖工具的配置文件，比如Babel的.babelrc postcss的.postcssrc

/build

项目启动时的一些文件，如 webpack 的配置文件 开发环境服务配置文件。一些简单工具函数/utils.js等等。

/config

关于整个项目的环境配置包括开发与生产。我们在node引入模块的时候可以直接引入目录。
我们在 node 引入模块时可以直接引入 require(’./config’);
他默认查找的就是该目录下的index.js文件。当然也可以不叫index.js这个需要一个/config目录下再去写一个package.json指定文件。

/dist

/dist目录下是将/src 目录下的源码编译之后生成的文件。一般项目部署就直接可以将/dist目录下的文件放在网站的根目录。

/src

开发环境文件

/mock

是前台开发的模拟数据接口的文件，里面就是一些后台接口的模拟数据。