所以我一直在使用 knockout.js 为我正在开发的特定 chrome 扩展进行数据绑定。我认为迁移到框架（如 Angular）可能是有意义的。使用 npm 为我的 Angular 安装所有依赖项后，node_module 文件夹超过 100 MB。这显然太大而无法包含在 chrome 扩展中，并且已安装在每个用户的机器上。关于我应该如何以不需要客户端机器上数百 MB 文件的方式将 Angular 用于我的扩展，有什么建议吗？
【问题讨论】：
标签： javascript angularjs google-chrome-extension npm
无需在您的 Chrome 扩展程序中包含 bower_components 或 node_modules 文件夹。尝试使用 Grunt/Gulp 进行缩小。
理想情况下，您的存储库应该包含一个 dist 文件夹，其中包含您的扩展程序的生产就绪状态。当您将扩展程序上传到 Chrome Webstore 时，您应该为此文件夹创建一个 ZIP。
使用以下 Grunt 插件来优化您的应用程序，
grunt-usemin - 将从 index.html 中提取所有样式表或脚本，并将它们组合成一个 CSS 或 JS 文件，因此您不必担心 node_modules 或 bower_components 文件夹。
grunt-contrib-uglify - 将丑化/缩小 JS 文件。
简而言之，将您的 Chrome 扩展程序视为任何真实的生产 Angular 应用程序，它通常包含一个分发文件夹，其中包含您的代码的优化版本。您将将此文件夹中的内容部署到生产环境，而不是整个存储库。
您可以参考我在 Github 上开发的名为 Browser Automation Tookit 的 Chrome 扩展程序。您可以查看 Gruntfile.js 和 dist 文件夹以获得进一步的指导。
【讨论】：
当您将 npm 用于客户端依赖项时，您应该只包含 dist 文件。 （例如 Angular - /node_modules/angular/angular.js）
通常这些文件只有几个 kb。 如果它们公开了此类（/node_modules/angular/angular**.min**.js）或自行缩小它，最好在生产中使用包缩小版本，您可以使用任何任务运行器（grunt/gulp）
此外，我强烈建议您不要重新发明轮子，而是从 yeoman 生成器或项目种子开始，例如：https://github.com/yeoman/generator-chrome-extension
【讨论】：