refactor webpack config

This commit is contained in:
uwap 2018-06-19 12:35:10 +02:00
parent 2d97ae4239
commit 8a37cf2c95
9 changed files with 31 additions and 131 deletions

View file

@ -8,9 +8,9 @@
1. run `yarn` to install all dependencies.
2. run `yarn watch CONFIG` to run a local build server that automatically builds
your the mqtt control map for the given CONFIG everytime something changes.
3. run `yarn build CONFIG` to create just a single build of the mqtt control map
3. run `yarn dev CONFIG` to create just a single build of the mqtt control map
for the given config.
4. run `yarn production-build CONFIG` to generate all files for production use.
4. run `yarn build CONFIG` to generate all files for production use.
## Config

View file

@ -697,7 +697,8 @@ const config : Config = {
{
image: require("../img/layers/rzl/labels.svg"),
name: "Labels",
defaultVisibility: "visible",
defaultVisibility: "hidden",
opacity: 0.8,
bounds: {
topLeft: [0, 0],
bottomRight: [1000, 700]

View file

@ -5,6 +5,7 @@
.leaflet-container {
height: calc(100vh - 64px);
max-height: 100%;
background: rgba(239,239,203,.59);
}
body {
margin: 0;

View file

@ -4,9 +4,9 @@
"author": "uwap <me+mqttmap.package.json@uwap.name>",
"description": "control devices via mqtt on a beautiful map of your space",
"scripts": {
"build": "webpack --bail --config webpack.dev.js --env",
"production-build": "webpack --bail --config webpack.prod.js --env",
"watch": "webpack-dev-server --open --config webpack.dev.js --env",
"build": "webpack --bail --config webpack.config.js -p --env",
"dev": "webpack --bail --config webpack.config.js --mode development --env",
"watch": "webpack-dev-server --open --config webpack.dev.js --mode development --env",
"travis": "./travis.sh",
"lint": "eslint -- --ext js --ext jsx src/",
"precommit": "yarn lint"
@ -15,7 +15,6 @@
"@material-ui/core": "^1.2.1",
"@material-ui/lab": "^1.0.0-alpha.5",
"@mdi/font": "^2.0.46",
"babel-preset-env": "^1.6.0",
"leaflet": "^1.3.1",
"lodash-es": "^4.17.4",
"mqtt": "^2.14.0",
@ -32,24 +31,22 @@
"babel-loader": "^7.1.1",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-env": "^1.6.0",
"clean-webpack-plugin": "^0.1.18",
"css-loader": "^0.28.9",
"eslint": "^4.16.0",
"eslint-plugin-flowtype": "^2.42.0",
"eslint-plugin-react": "^7.6.1",
"extract-text-webpack-plugin": "next",
"file-loader": "^1.1.5",
"flow": "^0.2.3",
"flow-bin": "^0.70.0",
"flow-typed": "^2.3.0",
"html-webpack-plugin": "^3.1.0",
"husky": "^0.14.3",
"lodash-webpack-plugin": "^0.11.4",
"style-loader": "^0.21.0",
"webpack": "^4.3.0",
"webpack-cli": "^3.0.0",
"webpack-dev-server": "^3.1.1",
"webpack-merge": "^4.1.1",
"webpack-shell-plugin": "^0.5.0"
},
"license": "MIT"

View file

@ -5,7 +5,7 @@ for conf in $(ls config/); do
if [ "$conf" = "utils.js" ]; then
continue
fi
yarn dev $conf
yarn build $conf
yarn production-build $conf
mv dist artifacts/$conf
done

View file

@ -2,14 +2,24 @@ const path = require('path');
const webpack = require('webpack');
const WebpackShellPlugin = require('webpack-shell-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const CleanWebpackPlugin = require('clean-webpack-plugin');
const preBuildScripts = process.env.NO_FLOW == undefined ?
process.env.FLOW_PATH != undefined ? [process.env.FLOW_PATH] : ['flow']
: [];
module.exports = {
const configPath = env => {
if (env === true) {
throw "No config file was provided.";
}
return path.resolve(__dirname, `config/${env}`);
};
module.exports = env => ({
entry: {
main: [configPath(env),
path.resolve(__dirname, 'src/index.jsx')]
},
resolve: {
modules: [path.resolve(__dirname, "src"), "node_modules"],
extensions: ['.js', '.jsx'],
@ -23,7 +33,10 @@ module.exports = {
},
module: {
rules: [
{ test: /\.(woff2?|eot|ttf|svg)$/, loader: "file-loader" }
// TODO: CSS follow imports and minify + sourcemap on production
{ test: /\.css$/, use: [ 'style-loader', 'css-loader' ] },
{ test: /\.(woff2?|eot|ttf|svg)$/, loader: "file-loader" },
{ test: /\.js(x)?$/, exclude: /node_modules/, loader: "babel-loader?cacheDirectory=true" }
]
},
plugins: [
@ -33,6 +46,5 @@ module.exports = {
title: 'Space Map',
template: 'index.ejs'
}),
new ExtractTextPlugin("styles.css"),
]
};
});

View file

@ -1,35 +0,0 @@
const merge = require('webpack-merge');
const path = require('path');
const common = require('./webpack.common.js');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const extractCSS = ExtractTextPlugin.extract({
fallback: "style-loader",
use: {
loader: "css-loader"
}
});
const configPath = env => {
if (env === true) {
throw "No config file was provided.";
}
return path.resolve(__dirname, `config/${env}`);
};
module.exports = env => merge(common, {
entry: {
main: [configPath(env),
path.resolve(__dirname, 'src/index.jsx')]
},
module: {
rules: [
{ test: /\.css$/, use: extractCSS },
{ test: /\.js(x)?$/, exclude: /node_modules/, loader: "babel-loader?cacheDirectory=true" }
]
},
devtool: "eval-cheap-module-source-map",
devServer: {
contentBase: './dist'
},
});

View file

@ -1,49 +0,0 @@
const webpack = require('webpack');
const path = require('path');
const merge = require('webpack-merge');
const common = require('./webpack.common.js');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const LodashModuleReplacementPlugin = require('lodash-webpack-plugin');
const extractCSS = ExtractTextPlugin.extract({
fallback: "style-loader",
use: {
loader: "css-loader",
options: {
sourceMap: true,
minimize: true
}
}
});
const configPath = env => {
if (env === true) {
throw "No config file was provided.";
}
return path.resolve(__dirname, `config/${env}`);
};
module.exports = env => merge(common, {
entry: {
main: [configPath(env),
path.resolve(__dirname, 'src/index.jsx')],
},
module: {
rules: [
{ test: /\.css$/, use: extractCSS },
{ test: /\.js(x)?$/, exclude: /node_modules/, loader: "babel-loader" }
]
},
devtool: "source-map",
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('production')
}
}),
// new LodashModuleReplacementPlugin(),
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HashedModuleIdsPlugin(),
new webpack.optimize.AggressiveMergingPlugin()
]
});

View file

@ -374,12 +374,6 @@ async@^1.5.2:
version "1.5.2"
resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
async@^2.4.1:
version "2.6.0"
resolved "https://registry.yarnpkg.com/async/-/async-2.6.0.tgz#61a29abb6fcc026fea77e56d1c6ec53a795951f4"
dependencies:
lodash "^4.14.0"
asynckit@^0.4.0:
version "0.4.0"
resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
@ -2504,15 +2498,6 @@ extglob@^2.0.4:
snapdragon "^0.8.1"
to-regex "^3.0.1"
extract-text-webpack-plugin@next:
version "4.0.0-beta.0"
resolved "https://registry.yarnpkg.com/extract-text-webpack-plugin/-/extract-text-webpack-plugin-4.0.0-beta.0.tgz#f7361d7ff430b42961f8d1321ba8c1757b5d4c42"
dependencies:
async "^2.4.1"
loader-utils "^1.1.0"
schema-utils "^0.4.5"
webpack-sources "^1.1.0"
extsprintf@1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.3.0.tgz#96918440e3041a7a414f8c52e3c574eb3c3e1e05"
@ -2650,9 +2635,9 @@ flatten@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
flow-bin@^0.69.0:
version "0.69.0"
resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.69.0.tgz#053159a684a6051fcbf0b71a2eb19a9679082da6"
flow-bin@^0.70.0:
version "0.70.0"
resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.70.0.tgz#080ae83a997f2b4ddb3dc2649bf13336825292b5"
flow-typed@^2.3.0:
version "2.4.0"
@ -3935,12 +3920,6 @@ lodash-es@^4.0.0, lodash-es@^4.17.4, lodash-es@^4.2.1:
version "4.17.8"
resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.8.tgz#6fa8c8c5d337481df0bdf1c0d899d42473121e45"
lodash-webpack-plugin@^0.11.4:
version "0.11.4"
resolved "https://registry.yarnpkg.com/lodash-webpack-plugin/-/lodash-webpack-plugin-0.11.4.tgz#6c3ecba3d4b8d24b53940b63542715c5ed3c4ac5"
dependencies:
lodash "^4.17.4"
lodash.assign@^4.0.3, lodash.assign@^4.0.6:
version "4.2.0"
resolved "https://registry.yarnpkg.com/lodash.assign/-/lodash.assign-4.2.0.tgz#0d99f3ccd7a6d261d19bdaeb9245005d285808e7"
@ -3957,7 +3936,7 @@ lodash.uniq@^4.5.0:
version "4.5.0"
resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
lodash@^4.0.0, lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0:
lodash@^4.0.0, lodash@^4.15.0, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0:
version "4.17.5"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
@ -6631,12 +6610,6 @@ webpack-log@^1.0.1, webpack-log@^1.1.2:
loglevelnext "^1.0.1"
uuid "^3.1.0"
webpack-merge@^4.1.1:
version "4.1.2"
resolved "https://registry.yarnpkg.com/webpack-merge/-/webpack-merge-4.1.2.tgz#5d372dddd3e1e5f8874f5bf5a8e929db09feb216"
dependencies:
lodash "^4.17.5"
webpack-shell-plugin@^0.5.0:
version "0.5.0"
resolved "https://registry.yarnpkg.com/webpack-shell-plugin/-/webpack-shell-plugin-0.5.0.tgz#29b8a1d80ddeae0ddb10e729667f728653c2c742"