【问题标题】：webpack custom loader just choose one file instead all fileswebpack 自定义加载器只选择一个文件而不是所有文件
【发布时间】：2020-01-04 06:43:27
【问题描述】：

我希望我的自定义加载器适用于文件夹中的所有 js 文件，但只需选择一个。

加载器

function loader(content) {
  //some logic to modify
  return content
}

Webpack 配置 #1

{
   test: /\.js$/,
   loader: "./src/org/loader/my-loader.js",
   include: path.join(__dirname, 'src/pages'),
   exclude: /node_modules/
}

Webpack 配置 #2

{
   test: /\.*$/,
   loader: "./src/org/loader/my-loader.js",
   exclude: /node_modules/
}

文件夹和文件

./postcss.config.js
./README.md
./.gitignore
./.babelrc
./package.json
./src
./src/images
./src/images/logo-up.jpg
./src/index.js
./src/pages
./src/pages/map
./src/pages/map/index.js
./src/pages/map/index.html
./src/pages/home
./src/pages/home/index.js
./src/pages/home/index.html
./src/fonts
./src/fonts/PressStart2P-Regular.ttf
./src/index.html
./src/org/loader/my-loader.js
./src/route/nourl
./src/route/nourl/index.js
./src/styles
./src/styles/index.scss
./src/styles/_variables.scss
./config
./config/webpack.prod.js
./config/webpack.dev.js
./config/paths.js
./config/webpack.common.js
./.eslintrc
./package-lock.json
./LICENSE

使用 webpack config #1 评估文件

src/pages/home/index.js

使用 webpack 配置 #2 评估文件

src/index.html
src/index.js
src/styles/index.scss
src/pages/home/index.js
src/route/nourl/index.js

我的目标

为特定文件夹内的所有 js 文件开发一个 webpack 加载器。在我的情况下，文件夹是 src/pages 和预期的文件：

./src/pages/map/index.js
./src/pages/home/index.js

问题

如何配置加载程序以评估特定文件夹中的所有文件？
为什么我的 webpack 配置 #1 选择一个文件？
为什么我的 webpack 配置 #2 会因为这个正则表达式选择随机文件而不是所有文件：/.*$/？

环境

Linux
nodejs 8
“webpack”：“^4.39.3”

【问题讨论】：

标签： javascript node.js regex webpack webpack-4

【解决方案1】：

Webpack 加载器将在加载器被导入后执行。

所以如果你的加载器没有为你的 js 文件执行，你必须在你的应用程序中导入这个文件：

const Home = require('../../MyJsModule')

Webpack 会检测这个需求并且你的加载器会检测到它！

【讨论】：