cookiecutter-django/{{cookiecutter.project_slug}}/webpack/common.config.js
Bruno Alla cbb0e19de7
Add Webpack support (#3623)
* Add support for Webpack as frontend pipeline

* Rename CI jobs

* Fix a couple of issues with Webpack + Docker

* Don't include Boostrap CSS from CDN with Webpack

* Rename variable

* Set publicPath in prod webpack config

* Fix removal of SASS files in post-gen hooks

* Add Webpack to readme usage section

* Run Django + Webpack dev server concurrently without Docker

* Fix async runserver command with Gulp/Webpack

* Upgrade django-webpack-loader to 1.5.0

* Pass variables required by Webpack at build time

* Upgrade django-webpack-loader to 1.7.0

* Add missing condition

* Add support for Azure Storage + Webpack

* Whitespaces

* Rename ROOT_DIR -> BASE_DIR

* Rename jobs

* Bump django-webpack-loader to latest

* Document limitation of Docker + Webpack + no Whitenoise

* Update section on custom Bootstrap compilation in generated readme
2023-01-29 12:12:12 +00:00

56 lines
1.5 KiB
JavaScript

const path = require('path');
const BundleTracker = require('webpack-bundle-tracker');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
target: "web",
context: path.join(__dirname, '../'),
entry: {
'project': path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/js/project'),
'vendors': path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/js/vendors'),
},
output: {
path: path.resolve(__dirname, '../{{cookiecutter.project_slug}}/static/webpack_bundles/'),
publicPath: '/static/webpack_bundles/',
filename: 'js/[name]-[fullhash].js',
chunkFilename: 'js/[name]-[hash].js',
},
plugins: [
new BundleTracker({filename: path.resolve(__dirname, '../webpack-stats.json')}),
new MiniCssExtractPlugin({ filename: 'css/[name].[contenthash].css' }),
],
module: {
rules: [
// we pass the output from babel loader to react-hot loader
{
test: /\.js$/,
loader: 'babel-loader',
},
{
test: /\.s?css$/i,
use: [
MiniCssExtractPlugin.loader,
'css-loader',
{
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: [
'postcss-preset-env',
'autoprefixer',
'pixrem',
],
},
},
},
'sass-loader',
],
},
],
},
resolve: {
modules: ['node_modules'],
extensions: ['.js', '.jsx'],
},
};