本文介绍如何快速创建一个基于webpack构建的chrome扩展，由于chrome扩展开发概念很多，如果需要，请结合附录食用。
首先需要安装好nodejs，推荐用nvs或其他工具管理node版本。这里用的是v8.5.0版本（之前用了v11.1.0在运行npm start的时候会报错，因为对chrome扩展来说node只是个构建工具，并且用nvs来管理node版本切换很方便，就不追究为什么报错了）。
一、安装yeoman
node -g install yo
二、安装生成chrome扩展的generator
npm install -g generator-chrome-extension-kickstart
三、使用yeoman创建项目
# 创建一个空目录
mkdir helloworld && cd helloworld
# 运行yeoman生成项目
yo chrome-extension-kickstart .然后按照提示进行项目配置
上图是选择需要创建的UI action
No：不创建
Browser：浏览器级别的action，一个浏览器一个实例
Page：页面级别的action，每个页面一个实例
这里我们先选择Page
上图是选择需要覆盖的浏览器的一些默认页面
No：不需要覆盖任何默认页面
Bookmarks Page：覆盖书签页面
History Page：覆盖历史页面
Newtab Page：覆盖新标签页面
这里我们选择No
上图是选择这个扩展需要的一些页面或者脚本
Options Page：表示需要一个配置页面
Devtools Page：表示在Devtools里需要新建一个页面
Content Scripts：表示需要一个与所访问的页面一起运行的脚本
Omnibox：表示给浏览器地址栏增加一个功能
这里我们全部选择，都来演示一下。根据提示，按a全选
上图是这个扩展需要的浏览器权限，比如Cookies就是扩展可以获取到cookie数据
这里为了简单就按a全选了。接下来一路回车就可以了
上图可以看出yeoman为我们生成了很多项目文件并且安装了依赖
四、运行扩展
启动项目编译
npm start
可以看到项目已经编译完生成了几个文件
开另外一个命令行窗口
编译生成的文件在dist/chrome/目录下，可以用浏览器把这个目录加载起来
打开浏览器的扩展管理页面，打开开发者模式，然后加载已解压的扩展程序，选择编译生成的dist/chrome/目录
然后发现扩展显示了一个错误按钮
点击进去之后提示'input' is not allowed for specified platform.，这个是因为我们之前选择权限的时候选择了全部，但是input权限不支持，我们需要删掉这个权限（或者也可以在选择权限的时候不勾选input）。
打开app/manifest.json文件，把这一行删掉
然后重新加载一下扩展，错误按钮就不见了
可以看到扩展已经成功运行起来了
五、进行开发
项目主要文件在app/目录下面，一般只要修改这里面的文件就够了
六、打包
npm run build
运行完上面的命令之后，会在packages/目录下生成zip包