如何從webpack javascript中的文件夾，子文件夾及其子文件夾動態獲取文件

Question

我正在嘗試使用webpack在VueJs構建一個小型應用程序，我想在其中動態包含文件夾中的config/routing文件。 我有一個這樣的文件夾結構：

plugins
|----Ecommerce
|--------backend
|--------frontend
|------------config.js
|------------routes.js
|------------components
|----------------products.vue
|----Blog
|--------backend
|--------frontend
|------------config.js
|------------routes.js
|------------components
|----------------posts.vue

為此，我試圖將我的文件包含在：

const configRequire = require.context('./../plugins/', true, /\.\/[^/]+\/config\.js$/);
const routesRequire = require.context('./../plugins/', true, /\.\/[^/]+\/routes\.js$/);

但不知何故，它不包括文件。 我猜我的正則表達式有問題

編輯：

發現問題后，我的文件沒有被導入，因為它位於folders/subfolder/subfolder ，如果我保持文件夾結構如下：

plugins
|----Ecommerce
|--------backend
|--------config.js
|--------routes.js
|--------frontend
|------------components
|----------------products.vue
|----Blog
|--------backend
|--------config.js
|--------routes.js
|--------frontend
|------------components
|----------------posts.vue

我可以看到我的文件被導入。 但是當我將config/routes文件保存在frontend文件夾中時沒有得到

幫我解決這個問題。 謝謝。

Answer 1

檢查此內容以更好地了解您當前的正則表達式： https : //regex101.com/r/Y9sDZc/1 （刪除第一行以查看它如何與第二行不匹配。）

我不完全確定您到底想匹配什么，不匹配什么，所以我只能猜測適合您的情況的正確解決方案是什么，但這里有一些選擇：
config\\.js匹配所有名為config.js文件。 目錄由您的require.context參數處理。 不過，這也將匹配plugins/foo/bar/config.js/somefile.txt ，如果您控制所有文件並確定這不是問題，使用config\\.js是您最簡單的解決方案。

更具選擇性的是：
.*\\/config\\.js$

希望有幫助。