如何使用 Webpack 和 Coffee 配置 BaconJS答案

【问题标题】：How do I configure BaconJS with Webpack and Coffee如何使用 Webpack 和 Coffee 配置 BaconJS
【发布时间】：2016-08-26 21:11:02
【问题描述】：

我正在将遗留代码移植到 Webpack 并且我有以下...

TS 中的依赖加载器

import "baconjs/dist/Bacon.js"

Coffee 中的模块

@stream = new Bacon.Bus()

当我尝试跑步时，我得到了

zone.js?fad3:269 Uncaught ReferenceError: Bacon is not defined

我尝试将它添加到我的 webpack 配置中......

new webpack.ProvidePlugin({
    ...
    Bacon: "Bacon"
}),

但这并没有帮助。

找不到模块：错误：无法解析模块中的“培根”...

我能做些什么来解决这个问题？

【问题讨论】：

【解决方案1】：

问题可能在于导入模块。

只为副作用导入一个模块

虽然不是推荐的做法，但一些模块设置了一些可以被其他模块使用的全局状态。这些模块可能没有任何导出，或者消费者对它们的任何导出都不感兴趣。要导入这些模块，请使用：
import "./my-module.js";

Bacon.js 是一个 UMD 模块，您不能以这种方式导入它。试试

import {Bacon} from "baconjs/dist/Bacon.js";

或者在 CS 中：

Bacon = require('baconjs/dist/Bacon.js')

并确保在路径中。

【讨论】：

我认为您错过了这是 CoffeeScript 而不是 Typescript 的事实，我认为导入不适用于 CS。我确实尝试过这个，我得到了error TS2307: Cannot find module 'baconjs/dist/Bacon.js'. 我在 node_modules 的那个位置看到了文件。
那么您的问题中的// In TS import "baconjs/dist/Bacon.js" 是什么？
我有一个加载依赖项的 TS 文件，但 Bacon 变量实际上用于 CS 而不是 TS。所以我的理解是，即使我使用 TS 加载模块，CS 也无法访问它，但我可能错了。无论哪种方式，我都不确定，因为我尝试时遇到错误。
会不会是旧版本的培根没有附加 UMD 模块？我想第二次认为导入应该由 ES2015 polyfills 处理，而不是 Typescript。所以如果我们能修复 Webpack 错误，也许你是对的。
如果你在CS模块中需要Bacon，你必须在这个模块中加载它。

【解决方案2】：

之前的答案是正确的，但我犹豫是否必须在每个需要它的咖啡脚本文件中包含Bacon = require("baconjs/dist/Bacon.js")。所以我继续将以下内容添加到我的 Typescript 依赖文件中......

window['Bacon'] = require('baconjs/dist/Bacon.js');

这似乎有效，并且不需要在每个咖啡脚本文件上单独使用require ;-)。

我最初尝试过

window.Bacon = require('baconjs/dist/Bacon.js');

【讨论】：