javascript - webpack babel 如果我不使用 import/require 如何复制转译文件

Question

我的项目中有一个名为 test.js

的文件

我不会在任何地方导入/需要它，这意味着我的 webpack 不会为该 js 文件调用 babel-loader。

问题:我想要的是将 test.js 移动到/dist 文件夹中，但作为编译/转换的。最佳实践是什么？

我尝试过的:我尝试使用 copy-webpack-plugin 并在复制文件之前使用其转换参数，但我似乎找不到好的 babel 包。

{
    from: 'test.js',
        to: '/dist/test.js',
            transform(content, path) {
        //what do I write here? 
    },
}

Answer 1

我能想到的最简单的方法是使用多个入口点，如下所示:

{
    entry: {
        a: "./your-main-stuff",
        b: "./your-single-file",
    },
    output: {
        path: path.join(__dirname, "dist"),
        filename: "[name].js"
    }
}

这将在 __dirname/dist 文件夹中创建您的 a.js 主包和 b.js 文件，如果您使用相应的加载器，则这两个文件都会被转译(小)。

来自 copy-webpack-plugin 文档 section :

webpack-copy-plugin is not designed to copy files generated from the build process; rather, it is to copy files that already exist in the source tree, as part of the build process.

所以让它移动转译文件似乎很困难(如果可能的话)。

更新。如果您想将文件输出到不同的文件夹而不更改 src 文件夹，则需要额外的工具。对于您的情况(只有 1 个文件)，我会编写一个简单的脚本并将其添加到 package.json 脚本部分并与 webpack 调用结合使用，例如:

"scripts": {
     "dev": "webpack && babel path-to-script.js --out-file path-to-script-compiled.js"
 }