介绍
webpack-assembler-react 是一个能够自动生成 webpack 配置文件的 npm 包。它基于 eslint-config-airbnb 和 babel-preset-react，可以自动绑定常用的 loaders 和 plugins，可以快速搭建 React 项目。
安装
使用 npm 安装 webpack-assembler-react：
npm install --save-dev webpack-assembler-react
使用
引入
webpack-assembler-react 中包含了多个 webpack 的配置文件，其中最基础的是 webpack.config.js，所以在项目根目录下可以创建项目的 webpack 配置文件 webpack.config.js：
const webpackAssemble = require('webpack-assembler-react');
module.exports = webpackAssemble;命令行使用
webpack-assembler-react 提供了一个简单的命令行工具，可以直接在项目根目录下执行：
webpack-assemble
这会自动生成 webpack 的配置文件，并且会启动 webpack dev server，可以通过 http://localhost:8080 访问应用。
配置
除了使用默认的配置外，webpack-assembler-react 还允许使用配置文件自定义配置，配置文件应该是一个 js 对象，可以定义如下的属性：
context：设置 webpack 执行时的上下文，默认为当前工作目录。entry：入口，可以是一个字符串或一个对象。output：输出到文件系统的目录和文件名。module：配置 module，其中包含 rules 和 loaders。plugins：插件列表。optimization：优化项。resolve：模块解析配置。
比如我们可以创建一个 project.js 并添加下面的配置：
-- -------------------- ---- -------
----- --------------- - -----------------------------------
-------------- - -----------------
-------- ----------
------ -----------------
------- -
----- -------------------- --------
--------- ------------
--
------- -
------ -
-
----- ----------
-------- -
----------------------- -------
--
---- -
---------------
--
--
--
--
-------- -
--- -----------------------------
--- -------------------------------------
--
------------- -
------------ -
------- ------
--
--
-------- -
-------- -
---------------
----------------------- ---------
--
----------- ------- ------- ---------
------ -
---- ----------------------- ----------
--
--
---然后在我们项目的 webpack.config.js 中引入这个配置：
const projectConfig = require('./project.js');
module.exports = projectConfig;示例代码
-- -------------------- ---- -------
-- ------------
------ ----- ---- --------
------ -------- ---- ------------
------ --- ---- --------
------ ---------------
-------------------- --- ---------------------------------
-- ----------
------ ----- ---- --------
------ ------------
------ ---- ---- -------------
-------- ----- -
------ -
---- ----------------
------- -----------------------
---- ---------- -------------------- ---------- --
---
---- ----------------------- --- ---- -- -------
----
--
--------------------
--------------------------
---------------
------------- -----------
-
----- -----
----
---------
------
--
-
------ ------- ----总结
webpack-assembler-react 可以帮助我们快速搭建 React 项目，自动生成基础的 webpack 配置文件，并支持自定义配置。使用 webpack-assembler-react，我们可以省去繁琐的配置步骤，专注于项目开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056b4581e8991b448e5462