Commit f14dfbbf authored by John Kirkwood's avatar John Kirkwood

Webpack MDC js and CSS

parent b7d1658c
Pipeline #2121 failed with stage
in 12 seconds
{% load static %}
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css" />
<script type="text/javascript" src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script>
<link rel="stylesheet" type="text/css" href="{% static "output.css" %}" />
</head>
<body>
<form id="form-django" method="POST">
......@@ -74,6 +73,5 @@
</div>
</form>
<script type="text/javascript" src="{% static "output.js" %}"></script>
<script>window.mdc.autoInit();</script>
</body>
</html>
window.mdc = require('material-components-web');
window.mdc.autoInit();
@import "material-components-web/material-components-web";
......@@ -9,8 +9,12 @@
},
"dependencies": {
"autoprefixer": "^9.1.5",
"css-loader": "^2.1.0",
"extract-text-webpack-plugin": "^4.0.0-beta.0",
"material-components-web": "^0.39.1",
"node-sass": "^4.11.0",
"postcss-loader": "^3.0.0",
"sass-loader": "^7.1.0",
"webpack": "^4.16.1",
"webpack-cli": "^3.1.0"
},
......
const autoprefixer = require('autoprefixer')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
var path = require('path')
const autoprefixer = require('autoprefixer');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
var path = require('path');
const extractSass = new ExtractTextPlugin({
filename: 'main.css',
})
filename: 'output.css',
});
module.exports = {
mode: 'development',
devtool: 'source-map',
entry: './main.js',
entry: ['./main.js', './main.scss'],
output: {
filename: 'output.js',
path: path.resolve(__dirname, 'blog/static')
......@@ -20,8 +20,12 @@ module.exports = {
// },
module: {
rules: [
{ test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader?limit=10000&mimetype=application/font-woff' },
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file-loader' },
{
test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
loader: 'url-loader?limit=10000&mimetype=application/font-woff' },
{
test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
loader: 'file-loader' },
{
test: /\.py$/,
loader: 'py-loader',
......@@ -43,14 +47,16 @@ module.exports = {
loader: 'postcss-loader',
options: {
sourceMap: true,
plugins: () => [autoprefixer()]
plugins: () => [autoprefixer({grid: false})]
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true,
includePaths: ['./node_modules']
includePaths: [
path.resolve(__dirname, 'node_modules')
]
}
}
]
......@@ -61,4 +67,4 @@ module.exports = {
plugins: [
extractSass
]
}
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment