webpack 将同名目录下的所有文件输出到不同的文件夹中

艾萨克牛顿

我有以下目录:

  - src/
    - js/
      - profile1/
        - script1.js
        - script2.js
      - profile2/
        - script3.js
        - script4.js
      - script5.js
  - dist/
    - js/
  package.js
  webpack.config.js

我正在尝试将所有 JS 文件从 webpack/src/jsdist/js文件夹,保留相同的命名和文件夹结构。

我可以为每个文件编写不同的配置,并为每个 JS 文件编写 webpack,但我想知道是否有一组配置可以一次性完成所有操作。

我努力了:

const path = require('path');

module.exports = {
  entry: './src/js/*.js',
  output: {
    filename: '*.js',
    path: path.resolve(__dirname, 'dist'),
  }
}

惨败。

优素福

您可以像使用glob一样首先匹配入口文件(用 安装它npm i glob)。然后您可以通过附加[name]output.filename. 这是完整的代码:

const path = require('path');
const glob = require('glob');

module.exports = {
  entry: Object.fromEntries(glob.sync(path.resolve(__dirname, 'src/js/**/*.js')).map((v) => [
    v.split('src/js/')[1], v,
  ])),
  output: {
    filename: '[name]',
    path: path.resolve(__dirname, 'dist/js'),
  },
};

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

配置webpack以在单独的子文件夹中输出图像/字体

webpack多个来源文件夹

使用webpack在输出目录中保留文件夹结构

Webpack-dev-server在与webpack输出不同的文件夹中提供服务

Webpack在单独的文件夹中

使用webpack导入目录中的所有sass文件

Webpack编译文件夹中的所有文件

TypeScript + Webpack解决symlink文件夹中的依赖项

webpack文件加载器加载文件夹中的所有文件

Webpack:如何查找特定文件夹名称内的所有文件

如何将多个输出文件夹创建到“ / dist /”文件夹中-Webpack

Webpack排除文件夹

webpack-dev-server和webpack->将文件输出到父目录,并使webpack-dev-server热重装仍然有效

Webpack图像文件夹

从webpack输出到更多文件

如何从Webpack JavaScript中的文件夹,子文件夹及其子文件夹动态获取文件

不提供Webpack dist文件夹

为什么Webpack延迟加载会从文件夹加载所有文件?

如何使用Webpack将不同的文件扩展名输出到不同的目录?

webpack与输出`build`文件夹的名称不同,而是获取数字值

重命名目录中的所有文件夹

bash列出所有目录,子目录,文件夹,子文件夹,然后输出到单独的文件

dist 文件夹中的 webpack 加载程序内联文件

WebPack 2 - 如何输出到 use/loader 链中的各种其他文件夹

使用 webpack 在 dist 文件夹中包含本地资源

Webpack - 输出文件

Webpack - 如何捆绑/要求文件夹(子文件夹)的所有文件

Webpack 做出反应。配置带有图片的文件夹

通过脚本循环一个目录下的所有.csv文件,并将每个循环的结果输出到不同目录下的单独.csv文件中