观察html文件的assets目录并将其复制到templates文件夹中。
lektor-webpack-html-helper的Python项目详细描述
Lektor网页包HTML帮助程序
这是一个用于lektor的插件，它添加了对用htmlwebpackplugin生成模板的支持。可以将这些模板生成到lektors assets文件夹中，该文件夹将用于观察新创建或修改的html文件。 然后，这些文件将被复制到lektors模板文件夹，以便lektor可以使用它们。 这个插件取决于lektor-webpack-support插件是否真正有用。
webpack/webpack.config.js
constpath=require("path");constMiniCssExtractPlugin=require("mini-css-extract-plugin");constHtmlWebpackPlugin=require("html-webpack-plugin");const{CleanWebpackPlugin}=require("clean-webpack-plugin");module.exports={mode:"production",entry:{main:"./src/index.js"},output:{filename:"[name].bundle.js",path:path.dirname(__dirname)+"/assets/generated"},optimization:{minimizer:[newHtmlWebpackPlugin({inject:false,filename:"layout_generated.html",template:"./src/layout_template.html"})],},plugins:[newCleanWebpackPlugin(),newMiniCssExtractPlugin({filename:"[name].css"})],module:{rules:[{test:/\.scss$/,use:[MiniCssExtractPlugin.loader,"css-loader","sass-loader"]}]}}
webpack/src/layout_template.html
<!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width, initial-scale=1.0"><metahttp-equiv="X-UA-Compatible"content="ie=edge"><title>{{ this.title }} · {{ config.PROJECT.name }} </title><% for (var css in htmlWebpackPlugin.files.css) { %> <linkhref="{{ '/generated/<%= htmlWebpackPlugin.files.css[css] %>' | asseturl }}"rel="stylesheet"><% } %> </head><body><main> {% block content %} {% endblock content %} </main><% for (var chunk in htmlWebpackPlugin.files.chunks) { %> <scriptsrc="{{ '/generated/<%= htmlWebpackPlugin.files.chunks[chunk].entry %>' | asseturl }}"></script><% } %> </body></html>
欢迎加入QQ群-->： 979659372
