用于简化 jsviews 包含的 Webpack 自定义加载器

问题描述

我使用 webpack 5 将我的文件打包到一个项目中（基于打字稿）。

该项目使用 jsviews 框架。因为我想打包所有东西，所以我使用了 assets-loader 模块将模板文件的内容直接包含在包中。

我的 webpack.config.ts 文件中有：

module: {
    rules: [
        {
            test: /\.tmpl\.html$/i,type:'asset/source',exclude: /node_modules/,}
    ],},

这允许我将模板作为这样的字符串导入：

import textField from './TextField.tmpl.html'

这按预期工作。

然而，这些字符串不应用作字符串，而是用作 jsviews 模板。

所以我像这样包装这些导入：

import textField from './TextField.tmpl.html'
import fileLeafRefField from './FileLeafRefField.tmpl.html'
import 'jsviews';

const templates = {
    textField: jsviews.templates("textField",textField),fileLeafRefField: jsviews.templates("fileLeafRefField",fileLeafRefField)
};

export default templates;

如您所见，我的字符串总是传递给 jsviews 引擎，而不会在其他地方使用。

有没有更简单的方法来做到这一点？

有没有办法“挂钩”资产导入以始终调用 jsviews 引擎？

据我所知，自定义 webpack 加载器可能是解决方案，但文档对我来说不清楚。

理想情况下，我希望您能够：

import something from './something.tmpl.html';

其中 something 是调用 jsviews.templates('something',<content of something.tmpl.html>) 的结果。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）