Observes the assets directory for html files and copies them into the templates folder.
Project description
lektor-webpack-html-helper
This is a plugin for Lektor that adds support for generating templates with webpacks HtmlWebpackPlugin. These templates can be generated into Lektors assets folder which will be observed for newly created or modified html files. These files will then be copied over to Lektors templates folder so that they can be used by Lektor. This plugin depends on the lektor-webpack-support plugin to be really useful.
webpack/webpack.config.js
const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const HtmlWebpackPlugin = 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: [
new HtmlWebpackPlugin({
inject: false,
filename: "layout_generated.html",
template: "./src/layout_template.html"
})
],
},
plugins: [
new CleanWebpackPlugin(),
new MiniCssExtractPlugin({
filename: "[name].css"
})
],
module: {
rules: [{
test: /\.scss$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
"sass-loader"
]
}]
}
}
webpack/src/layout_template.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>{{ this.title }} · {{ config.PROJECT.name }} </title>
<% for (var css in htmlWebpackPlugin.files.css) { %>
<link href="{{ '/generated/<%= htmlWebpackPlugin.files.css[css] %>' | asseturl }}" rel="stylesheet">
<% } %>
</head>
<body>
<main>
{% block content %}
{% endblock content %}
</main>
<% for (var chunk in htmlWebpackPlugin.files.chunks) { %>
<script src="{{ '/generated/<%= htmlWebpackPlugin.files.chunks[chunk].entry %>' | asseturl }}"></script>
<% } %>
</body>
</html>
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
File details
Details for the file lektor-webpack-html-helper-0.1.3.tar.gz
.
File metadata
- Download URL: lektor-webpack-html-helper-0.1.3.tar.gz
- Upload date:
- Size: 3.3 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/1.13.0 pkginfo/1.5.0.1 requests/2.22.0 setuptools/41.0.1 requests-toolbelt/0.9.1 tqdm/4.33.0 CPython/3.8.0b3+
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | b3069089e9e9af038c69a3185c8ed31253a5fae2941c0164bd1a3c8e3ab3e04a |
|
MD5 | b6c161df1cab3cdc77b4832517b29921 |
|
BLAKE2b-256 | 7ff15abb57d0834db5333d27aec1cc983a45c15f0c4fdf0a6ea8ccc35b6187bd |
File details
Details for the file lektor_webpack_html_helper-0.1.3-py3-none-any.whl
.
File metadata
- Download URL: lektor_webpack_html_helper-0.1.3-py3-none-any.whl
- Upload date:
- Size: 3.4 kB
- Tags: Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/1.13.0 pkginfo/1.5.0.1 requests/2.22.0 setuptools/41.0.1 requests-toolbelt/0.9.1 tqdm/4.33.0 CPython/3.8.0b3+
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 96f6d50d902883a383bd57c68ba7afe9cab952abd84c84a679dd1ca4e58f8cae |
|
MD5 | a1e5aa45e18555df4b48d4b8101a9377 |
|
BLAKE2b-256 | 43d1a401b2c67b4ff2375a302e0709e01b01c411edd2694946b8cc7f03350a3b |