[change] local webpack won't use built css file

This commit is contained in:
Daniel
2019-04-22 22:19:58 -04:00
parent 7404496800
commit f2c7607638
3 changed files with 77 additions and 17 deletions

53
index.dev.html Normal file
View File

@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Chaotic Backup</title>
<meta name="description" content="Chaotic Backup">
<link rel="stylesheet" type="text/css" href="/src/css/legacy.css">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"/>
<style>
html, body, div, span, a, p, ul, li, h1 {
margin: 0;
border: 0;
padding: 0;
}
a {
color: inherit;
text-decoration: inherit;
}
html, body { height: 100%; }
html { background-color:#494949; }
#root { min-height: 100%; }
body { overflow-x: hidden; }
</style>
<!-- Start Single Page Apps for GitHub Pages -->
<script type="text/javascript">
(function(l) {
if (l.search) {
var q = {};
l.search.slice(1).split('&').forEach(function(v) {
var a = v.split('=');
q[a[0]] = a.slice(1).join('=').replace(/~and~/g, '&');
});
if (q.p !== undefined) {
window.history.replaceState(null, null,
l.pathname.slice(0, -1) + (q.p || '') +
(q.q ? ('?' + q.q) : '') +
l.hash
);
}
}
}(window.location))
</script>
<!-- End Single Page Apps for GitHub Pages -->
</head>
<body>
<div id="root"></div>
<script src="/build/bundle.js"></script>
</body>
</html>

View File

@@ -3,7 +3,7 @@
"version": "2.0.0",
"description": "Chaotic Backup",
"scripts": {
"start": "webpack-dev-server -d --inline --host 0.0.0.0 --history-api-fallback",
"start": "webpack-dev-server -d --inline",
"build": "webpack -p"
},
"repository": {

View File

@@ -10,6 +10,13 @@ const devMode = (process.env.NODE_ENV !== 'production' && process.argv.indexOf('
const config = {
entry: ['@babel/polyfill', `${__dirname}/src/components/index.js`],
devServer: {
host: '0.0.0.0',
historyApiFallback: {
index: 'index.dev.html',
},
},
output: {
path: `${__dirname}/build`,
publicPath: '/build/',
@@ -22,9 +29,9 @@ const config = {
cache: true,
parallel: true,
sourceMap: true,
extractComments: true
extractComments: true,
}),
new OptimizeCSSAssetsPlugin({})
new OptimizeCSSAssetsPlugin({}),
],
splitChunks: {
cacheGroups: {
@@ -32,30 +39,30 @@ const config = {
name: 'styles',
test: /\.css$/,
chunks: 'all',
enforce: true
}
}
}
enforce: true,
},
},
},
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loader: 'babel-loader',
options: {
'presets': [
presets: [
'@babel/preset-env',
'@babel/preset-react',
'@babel/preset-flow',
],
'plugins': [
plugins: [
'@babel/plugin-transform-runtime',
['@babel/plugin-proposal-decorators', {'legacy': true }],
['@babel/plugin-proposal-class-properties', { 'loose': true }]
]
}
['@babel/plugin-proposal-decorators', {legacy: true }],
['@babel/plugin-proposal-class-properties', { loose: true }],
],
},
},
{
test: /\.s?[ac]ss$/,
@@ -64,8 +71,8 @@ const config = {
'css-loader',
'sass-loader',
],
}
]
},
],
},
resolve: {
@@ -84,7 +91,7 @@ const config = {
new MiniCssExtractPlugin({
filename: '[name].css',
chunkFilename: '[id].css',
})
}),
],
};