https://github.com/tommasoamici/html-webpack-plugin-django
A Webpack plugin to output Django static tags with html-webpack-plugin
https://github.com/tommasoamici/html-webpack-plugin-django
django html html-webpack-plugin webpack webpack-plugin
Last synced: 12 months ago
JSON representation
A Webpack plugin to output Django static tags with html-webpack-plugin
- Host: GitHub
- URL: https://github.com/tommasoamici/html-webpack-plugin-django
- Owner: TommasoAmici
- Created: 2021-06-23T13:10:28.000Z (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2025-04-13T10:50:35.000Z (12 months ago)
- Last Synced: 2025-04-13T11:38:21.122Z (12 months ago)
- Topics: django, html, html-webpack-plugin, webpack, webpack-plugin
- Language: Python
- Homepage:
- Size: 795 MB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# html-webpack-plugin-django
A template for Typescript projects
## At a glance
[](https://github.com/TommasoAmici/html-webpack-plugin-django/actions/workflows/build.yml) [](https://codecov.io/gh/TommasoAmici/html-webpack-plugin-django)

## Getting started
First, install the package
```sh
# npm install -D html-webpack-plugin-django
yarn add -D html-webpack-plugin-django
```
In your `webpack.config.js` file add the plugin after `html-webpack-plugin`.
`html-webpack-plugin-django` will output Django static tags in the head and body of your HTML index file.
This plugin operates under a few assumptions:
1. You have added the `{% load static %}` tag to your HTML template
2. Your webpack bundle is emitted in one of your [Django project's static files directories](https://docs.djangoproject.com/en/3.2/howto/static-files/).
**Example**
```js
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const HtmlWebpackPluginDjango = require("html-webpack-plugin-django");
module.exports = (env, argv) => {
return {
output: {
path: path.resolve("path/to/your/django/static/dist"),
filename: "js/[name].[contenthash].js",
publicPath: "/static/",
},
...
plugins: [
new HtmlWebpackPlugin(),
new HtmlWebpackPluginDjango({ bundlePath: "dist" }),
],
};
};
```
**Output**
```html
```
## Found a bug?
Please file a report in [this repository's issues](https://github.com/TommasoAmici/html-webpack-plugin-django/issues)
## Development
If you want to contribute to this project, that's great to hear!
You can start at [CONTRIBUTING.md](./CONTRIBUTING.md).