Webpack

Question

我正在尝试查看是否有更短的方法来运行ning webpack 包，以及为什么我的加载程序无法工作。

这是我的代码：

module.exports = {
context: path.join(__dirname, 'dist'),
entry: ['./ES6bundle.js', './jQuery.js'],
output: {
    filename: 'bundle.js',
    path: path.join(__dirname, 'dist')
}
};
// module: {
//     loaders: [{
//         test: /\.js?$/,
//         exclude: /node_modules/,
//         loader: 'babel-loader',
//         query: {
//             presets: ['env']
//         }
//     }]
// };

module.exports 可以工作，但是当我运行加载程序时，我得到错误。

我的另一个问题是关于将多个条目合并到一个文件中。
我现在做的项目有很多JS文件，想知道有没有多入口的快捷方式。我可以在同一个文件夹中获取所有 JS 文件，或者拥有一个 JS 文件来要求所有这些文件名，而不是输入多个条目的文件名吗？

让我知道这是否有意义。我对编程比较陌生。谢谢！

Answer 1

关于你问题的第二部分：

can I grab all JS files in the same folder or have a JS file to require them all

你可以有一个条目文件，你可以在里面做：

module.exports = {
    context: path.join(__dirname, 'dist'),
    entry: ['./jQuery.js', './allJsFilesOfFolder.js'],

allJsFilesOfFolder.js:

require.context("../scripts/", true, /\.js$/);

这将捆绑 scripts 内的所有脚本及其所有 subfolders.

您需要安装 @types/webpack-env 才能使用 context。

如果您只想捆绑 scripts 文件夹中的脚本，请指定 false。

你可以对图片等其他资源做同样的事情，你只需要调整 regex

Answer 2

复制@Legends 评论作为答案。

have no experience with vue files, but as I said you can bundle not only js files, but also image files, for example the regex for image files would be: /.(png|ico|svg|jpg|gif)$/.

Webpack - 如何 bundle/require 文件夹（子文件夹）的所有文件

Webpack - How to bundle/require all files of a folder (subfolder)

javascript

bundle

atom-editor