问题标签 [babel-loader]

是否可以将 webpack 配置为等效于：

这样一个目录结构看起来像这样：

将所有文件编译为 ES5 并在lib目录下以相同的结构输出它们：

我通过了所有文件路径的通配符并将它们作为单独的条目传递，但似乎 webpack 在定义输出文件时“忘记了”文件的位置。Output.path仅提供[hash]令牌，虽然Output.file有更多选项，但仅提供和[name]，因此至少看起来不支持这种编译。[hash][chunk]

为了给我的问题提供一些背景信息，我正在创建一个由 React 组件及其相关样式组成的 npm 模块。我正在使用 CSS 模块，所以我需要一种将 JavaScript 和 CSS 编译到模块的 lib 目录中的方法。

这一定是我遇到过的 webpack 最奇怪的问题之一......

查看此捆绑包细分： react 116.01KB - 足够公平

react-dom 533.24KB - 严重 WTF

我认为这可能是我的依赖项中的损坏，但是对 node_modules 进行核对并重新安装没有任何效果。我想这与 webpack 捆绑它的方式有关，但我迷失了想法。我处理 .js 导入的方式是非常标准的。

我想使用全局模块/预设与 webpack 一起使用（即不想在项目中安装它们）

我的配置文件：webpack.config.js

我检查了这个问题，但它对我不起作用。我对nodejs不太熟悉。我成功地使用 `resolveLoader:modules 使用全局安装中的加载器 任何帮助将不胜感激。谢谢。

尝试使用 babel 设置 webpack 2 时遇到以下错误消息：

ERROR in Entry module not found: Error: Can't resolve 'babel-loader' in 'path_to_project_dir'

webpack 2 文档之后的配置文件：

我的 packages.json 中有以下开发依赖项：

我的节点和 npm 版本是：

我的操作系统是 macOS Sierra

此错误消息的来源可能是什么，我应该如何解决它。我尝试了很多教程和博客文章来找到解决方案，但都没有奏效。

我的 webpack.config.js 文件中有以下内容：

当我运行时，webpack我收到以下错误：

我正在使用 Webpack 版本 2.3.2。

以下是我正在使用的开发依赖项：

对于babel-loader，我使用的是 beta 版本，因为建议将 7.x 版本与 Webpack 2 一起使用。以下来自Github repo：

webpack 1.x | babel-loader <= 6.x

webpack 2.x | babel-loader >= 7.x（推荐）（^6.2.10 也可以，但有弃用警告）

版本 7.0.0 尚未发布，所以我正在使用测试版。我尝试过使用 6.2.10，但仍然遇到相同的错误。

当我只使用其中一个规则时，webpack 构建成功。例如，当我只有js规则（并删除 CSS 文件）时，它可以工作。

或者当我只有 CSS 规则（并删除任何 ES6 代码）时，它可以工作。

会发生什么？这可能是问题babel-loader还是我的配置文件结构不正确？

导入带有 .js 作为文件扩展名的 es6 react 组件时，Webpack Babel 加载器失败。如果将文件扩展名更改为 .jsx，则 babel 会正确编译。有什么线索吗？

编辑：

更新以下日志。

我有这个 Webpack 配置：

我在命令行运行 $webpack 并得到一个输出文件，我将文件加载到浏览器中，如下所示：

如果我在浏览器中加载这个 html 文件，我会得到：

我在 Github 上查看了一堆问题，但似乎都没有解决问题。有谁知道可能出了什么问题？

我使用的是 Webpack 版本 2.3.3。

附带说明 - 我在哪里可以找到一些适用于 Node.js / NPM 模块的 polyfill？

$export似乎是 Webpack 生成的一个函数，下面是我的输出文件中出现的一些函数：

一段时间以来，我们一直在使用带有 babel-loader 插件的 webpack 来转译 ES。对于我们的开发环境，我们的配置文件如下所示：

我用webpack-dev-server --inline --config=webpack-dev.config.js --content-base='client'.

问题是，如果我将app.js条目更改为app2.js或其他任何内容，该文件仍由 webpack 服务器提供（在 8080 上运行），但不再被转译。

app.js就 babel-loader 而言，这个名字有什么独特/神奇之处吗？几乎我能找到的每个示例教程，包括 webpack 文档，都使用这个app.js约定，但显然它的名字应该可以是任何东西。

我正在使用 webpack 2.3.3 使用 async/await javascript 语法构建我的 node.js 应用程序。转译是使用 babel-loader 6.4.1 完成的。我的package.json样子是这样的：

我的 webpack 配置在配置文件中使用transform-async-to-generator带有行的插件：loaders: ['babel-loader?presets[]=es2015&presets[]=stage-0&presets[]=react&plugins[]=transform-async-to-generator', 'eslint-loader']webpack/prod.js

当我运行npm run build时，构建在包含async function foo(arg) { (...) }错误的行上失败Parsing error: Unexpected token function。

当我删除异步/等待代码部分时，构建成功。

我在这里和这里查看了解决方案，但无法构建 async/await 代码工作。

有人可以帮我吗？多谢

为什么我的 babel-loader 没有转译？我添加了：让 x = 'LOL'; 控制台.log(x); 到我的 src/main.js。它不输出任何错误并创建输出文件。但它不会将 es6 语法转换为 es5。

这是我的 src/main.js

我的输出文件 dist/bundle.min.js 看起来像这样（让 isnt 变成 var）：

我的 webpack.config.js：

我的 package.json：