/webpack-step

webpack 主要功能学习练习

Primary LanguageJavaScript

webpack-step

webpack 主要功能学习,一步步实现webpack 的项目构建。

  1. 实现webpack实现项目构建的基本功能,输入输出;
  2. 加入html-webpack-plugin 自动实现模版的js 引入;
  3. babel-loader 实现es6 语法转 es5 语法;
  4. 利用 webpack-dev-server 实现热加载和开启服务功能;
  5. devtool='inline-source-map' 实现开发状态下的调试;
  6. yargs-parser 模块解析命令行参数;
  7. 利用 cross-env(运行跨平台设置和使用环境变量的脚本),保证windows 和 linux 的 环境变量设置统一;
  1. 增加对于sass,less 的解析功能;
  2. 增加对于图片,文件的加载解析;
  3. 增加eslint 实现语法检查;
  4. 代码分离,分离第三方模块代码;
  5. js和css 分离开来; mini-css-extract-plugin
  6. 加入依赖可视化查看工具 webpack-bundle-analyzer;
  7. shim 预置依赖;

-