直接在浏览器中使用 NPM 模块答案

【问题标题】：Use an NPM module directly in the browser直接在浏览器中使用 NPM 模块
【发布时间】：2018-05-05 05:26:33
【问题描述】：

这可能是一个愚蠢的问题，或者答案太明显以至于我找不到它。

基本上我想在我非常简单的网络应用程序中使用Redux。我希望能够像这样包含 redux：

<script type="text/javascript" src="js/redux.js"></script>

然后像这样直接在我的代码中使用它：

var store = redux.createStore(...);

我尝试了 webpack 和 browserify，但我无法让它工作。有什么想法吗？

【问题讨论】：

【解决方案1】：

如果您想将包直接包含在浏览器中以用于较小的用例，您可以使用 unpkg.com，它是 NPM 上所有可用内容的快速预包列表（根据他们网站上的声明）

【讨论】：

【解决方案2】：

我让 Redux 使用他们预先构建的 UMD 文件。
但是要直接在浏览器中使用其他 NPM 模块，这是要做什么（我不知道这是否是正确的方法，但它对我有用）：

1- 创建一个简单的文件main.js ：

window.Redux = require('redux');

2- 全局安装 browserify：

npm install -g browserify

3- 从命令行浏览文件（无配置文件）：

browserify main.js -o redux.js

现在只需将redux.js 包含为<script> 标记

【讨论】：

【解决方案3】：

要通过 <script> 标签导入 Redux，您必须使用 UMD 构建。

根据docs，它们存在于dist/ folder。

【讨论】：