在我目前的專案中，我正在嘗試實作以下內容：
讓我們假設以下檔案結構：
/src/
/src/components/MyComponent.vue
/src/overwrites/components/MyComponent.vue
（在任何 *.vue 檔案中）：
import MyComponent from '@/components/MyComponent.vue'.
如果在并行現有目??錄“覆寫”中存在相同的檔案，則此匯入應該匯入它，而不是從 /src/components/ 匯入。
為了從熱多載等中受益，我想通過 webpack 解決這個問題。
但是，如何擴展vue-loader或者拿到它前面我還沒有想通。
uj5u.com熱心網友回復：
您可以使用不涉及或不涉及require.context的組件來爬取目錄。webpackvue-loader
例如你有結構：
.src
-- components
| -- MyComponent.vue
-- overwrites
| -- components
| | -- MyComponent.vue
您將把index.js檔案放在每個components檔案夾中的內容：
const requireModule = require.context('./', false, /\.vue$/)
requireModule.keys().forEach(fileName => {
if (fileName === './index.js') return;
const moduleName = pascalCase(
fileName.replace(/(\.\/|\.vue)/g, '')
);
components[moduleName] = requireModule(fileName)
});
export default components;
然后您將能夠index.js在根組件檔案中匯入這些檔案，例如：
import components from './components/index.js';
export default {
components: components,
// ...
}
它將加載目錄中的所有vue檔案components。它將解決熱多載的問題。
不過，您將不得不自己管理重復組件的加載，可能Object.assing類似于：
import components from './components/index.js';
import {components as overwrites} from './overwrites/components/index.js';
export default {
components: Object.assign({}, components, overwrites),
// ...
}
重復的組件將被替換。
uj5u.com熱心網友回復：
我使用自定義 webpack 決議器解決了這個問題。與此類似： https ://github.com/hollandThomas/webpack-custom-resolver/blob/master/StyleResolverPlugin.js
但是，我檢查“.vue”而不是“.js”，然后用路徑代替檔案名。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/507934.html
下一篇：i18n不允許嵌套占位符