介绍
generator-anzdig-aw-es6 是一个基于 Yeoman 的前端开发脚手架，可以快速创建一个基础的 ES6 项目结构。使用了 Webpack 和 Babel 等流行的前端工具，因此也支持了 React 和其他的前端框架。
安装
在使用之前需要先安装 Yeoman 和 generator-anzdig-aw-es6。请使用 npm 安装：
npm install -g yo generator-anzdig-aw-es6
使用
在命令行中进入到你想创建项目的目录，输入以下命令：
yo anzdig-aw-es6
然后根据提示输入一些项目基本信息，比如项目名称、描述等。输入完成后，脚手架就会为你创建一个基于 ES6 的项目结构。
项目结构
生成的项目结构如下：
-- -------------------- ---- ------- ------------- --- ------ - ------- ----------- --- ---- - ----- - --- ----------- - -- -- - --- ------- - ---- - --- ---------- - ---- ---- - --- -------- - ---- - --- ------- - ---- - --- -------- - ---- --- -------- - ----- ---- --- -------------- - ------ ---- --- ---------- - --- ---- --- ------------ - ------ --- --------- - ------
配置
本脚手架默认使用以下配置：
- Webpack 4
- Babel 7
- ESLint
- Sass
可以在项目根目录下的 package.json 文件中修改这些配置。
Webpack 配置
修改根目录下的 webpack.config.js 文件以调整 Webpack 配置。可以修改 entry、output、module、plugins 等等选项。
Babel 配置
修改根目录下的 .babelrc 文件以调整 Babel 配置。可以添加或删除插件以调整编译过程。由于使用的是 Babel 7，因此需要注意配置项是否正确。
ESLint 配置
修改根目录下的 .eslintrc.json 文件以调整 ESLint 配置。可以添加或删除规则以调整代码检查过程。默认使用了 airbnb 的配置项。
Sass 配置
如果需要使用 Sass，请将 .scss 文件添加到样式目录中。本脚手架默认采用 SCSS 语法。可以修改 webpack.config.js 文件以调整 Sass 配置。
示例代码
以下是一个简单的 React 组件，可供参考：
-- -------------------- ---- -------
------ ----- ---- --------
------ --------- ---- -------------
----- ----------- - -- ---- -- -- -
-----
---------- ------------
------
--
--------------------- - -
----- ----------------------------
--
------ ------- ------------结论
generator-anzdig-aw-es6 为前端开发者提供了便捷快速创建基于 ES6 的项目结构的方式。使用本脚手架可以快速优雅地开始你的前端项目开发。希望本教程能对你有帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055e7b81e8991b448dbd68