jyrama/fe-boilerplate
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

CSS build changes et al

Browse source 
Signed-off-by: Jyri Genral <jyri.eerola@jrd.fi>
This commit is contained in:
Jyri Genral 2020-05-02 13:12:27 +02:00
parent dced758ea4
commit de335261f0
3 changed files with 38 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

1
index.html
View file

@ -1,6 +1,7 @@
<html> <html>
<head> <head>
<title>MobX Boilerplate</title> <title>MobX Boilerplate</title>
<link rel="stylesheet" href="/static/main.css" />
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>

4
tsconfig.json
View file

@ -5,7 +5,9 @@
"experimentalDecorators": true, "experimentalDecorators": true,
"jsx": "react", "jsx": "react",
"outDir": "dist", "outDir": "dist",
"lib": ["dom", "es2015"] "lib": ["dom", "es2015"],
"sourceMap": true,
"resolveJsonModule": true
}, },
"exclude": [ "exclude": [
"node_modules", "node_modules",

36
webpack.config.js
View file

@ -1,9 +1,13 @@
var path = require('path'); var path = require('path');
var webpack = require('webpack'); var webpack = require('webpack');
const ExtractCssChunks = require('extract-css-chunks-webpack-plugin');
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
module.exports = { module.exports = {
devtool: 'eval', devtool: 'inline-source-map',
mode: 'development', mode: 'development',
// mode: 'production',
entry: [ entry: [
'webpack-dev-server/client?http://localhost:3000', 'webpack-dev-server/client?http://localhost:3000',
'./src/index' './src/index'
@ -17,11 +21,39 @@ module.exports = {
extensions: ['.js', '.ts', '.tsx'], extensions: ['.js', '.ts', '.tsx'],
alias: { mobx: __dirname + "/node_modules/mobx/lib/mobx.es6.js" } alias: { mobx: __dirname + "/node_modules/mobx/lib/mobx.es6.js" }
}, },
plugins: [
new ExtractCssChunks({
filename: '[name].css',
chunkFilename: '[id].css',
})
],
module: { module: {
rules: [{ rules: [{
test: /\.tsx?$/, test: /\.tsx?$/,
loader: "ts-loader", loader: "ts-loader",
include: path.join(__dirname, 'src') include: path.join(__dirname, 'src')
}] },
{
test: /\.less$/,
use: [
{
loader: ExtractCssChunks.loader
},
{
loader: 'css-loader'
},
{
loader: 'less-loader',
options: {
javascriptEnabled: true
},
},
],
},
{
test: /\.css$/i,
use: [ExtractCssChunks.loader, 'css-loader'],
},
]
} }
}; };