如何在 Node 应用程序中使用 Webpack 加载器？答案

【问题标题】：How to use Webpack loaders in a Node app?如何在 Node 应用程序中使用 Webpack 加载器？
【发布时间】：2016-07-19 13:25:06
【问题描述】：

有没有办法在 Node 应用程序中使用 Webpack 加载器/在 Webpack 环境中运行 Node 应用程序？

例如，我有一个带有样式加载器的 webpack 配置。在我的 Node 应用程序中，我执行以下操作：

import style from 'style.css'

console.log(style.someClass)

我想像$ node app.js一样运行它

【问题讨论】：

标签： node.js webpack loader

【解决方案1】：

基于Webpack NodeJS API，我有一个可行的想法。如果我们将我们希望能够使用 Webpack 环境的代码（带有已配置的模块加载器）放入一个模块中会怎样：

appModule.js：

import style from 'style.css'

console.log(style.someClass)

然后require 它带有以下内容：

app.js：

import Webpack from 'webpack'
import MemoryFS from 'memory-fs'

...

webpackConfig.entry = 'appModule.js'
webpackConfig.output = 'appModule-out.js'

let compiler = Webpack(webpackConfig)
let mfs = new MemoryFS()

compiler.outputFileSystem = mfs
compiler.run(function (err, stats) {
    require(webpackConfig.output)
})

可能它不起作用，因为 require 在物理 FS 上查找输出...我们可以从内存 FS 中 require 吗？我还没有尝试过 - 有什么想法吗？

【讨论】：

【解决方案2】：

Webpack 加载器不是转译器或解释器，它们只是简单地收集资产，然后将其处理为诸如 SASS 或文本连接器之类的东西；在 Webpacks 环境的范围内。

因此不可能以您想要的方式重用它们，因为虽然您当然可以导入和调用它们（它们仍然只是函数 + 类），但它们不会将 CSS 转换为 JSON 对象（它们不会'不要这样做），就像你在你想要的例子中写的那样。

看起来你只需要一个 CSS 解析器的 JS 实现 - 看看 https://github.com/reworkcss/css

【讨论】：

我正在寻找能够让我在 Webpack 环境中运行代码块的东西。我不是在寻找特定的 CSS 加载器，这只是一个示例。但看起来在 Webpack 环境中运行代码的唯一方法是使用 Webpack 运行它：$ webpack app.js

【解决方案3】：

您应该能够创建一个以node 环境为目标的编译，您只需调用node output.js 即可最终运行它，这将立即执行入口点模块。

请注意，如果您使用的是较新版本的 Node.js，Webpack 不支持 ES2015 模块语法，因此您必须为 Node.js 配置 Babel 以及 transform the modules .

【讨论】：