我有一个这样的js文件
const link = () => {
return '<p>my text </p>'
}
我想使用 webpack 返回一个 html 文件:
<p>my text </p>
我需要使用哪个加载器？你有一个 webpack 配置示例吗？
谢谢
最佳答案
听起来您想从 js 文件创建 HTML 文件。
如果要寻找与此类似的“静态站点生成器”:
如果您没有使用 .像 React 或 Angular 这样的框架，您可能必须使用模板语言，例如 Handlebars 或 ejs .
以下是一些如何开始构建网站的示例:
- https://github.com/markdalgleish/static-site-generator-webpack-plugin/tree/master/test/success-cases
您的index.js文件可能看起来更像:
module.exports = function(locals) {
return locals.template({ html: '<h1>' + locals.path + '</h1>' });
};
它将与 template.ejs 文件结合使用，例如:
<html>
<body>
<%- html %>
</body>
</html>
和一个 wabpack 配置文件，例如:
var StaticSiteGeneratorPlugin = require('static-site-generator-webpack-plugin');
var StatsWriterPlugin = require("webpack-stats-plugin").StatsWriterPlugin;
var ejs = require('ejs');
var fs = require('fs');
var template = ejs.compile(fs.readFileSync(__dirname + '/template.ejs', 'utf-8'))
var paths = [
'/',
'/foo',
'/foo/bar'
];
module.exports = {
entry: __dirname + '/index.js',
output: {
filename: 'index.js',
path: __dirname + '/actual-output',
libraryTarget: 'umd'
},
plugins: [
new StaticSiteGeneratorPlugin({
paths: paths,
locals: {
template: template
}
}),
new StatsWriterPlugin() // Causes the asset's `size` method to be called
]
};
关于javascript - Webpack使用html文件中的html文字提取js，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47927507/