integration-examples/loop-test-plugin/webapp/webpack.config.js

118 lines
2.8 KiB
JavaScript

const exec = require("child_process").exec;
const path = require("path");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const PLUGIN_ID = require("../plugin.json").id;
const NPM_TARGET = process.env.npm_lifecycle_event; //eslint-disable-line no-process-env
const isDev = NPM_TARGET === "debug" || NPM_TARGET === "debug:watch" || NPM_TARGET === 'build:watch';
const plugins = [];
if (NPM_TARGET === "build:watch" || NPM_TARGET === "debug:watch") {
plugins.push({
apply: (compiler) => {
compiler.hooks.watchRun.tap("WatchStartPlugin", () => {
// eslint-disable-next-line no-console
console.log("Change detected. Rebuilding webapp.");
});
compiler.hooks.afterEmit.tap("AfterEmitPlugin", () => {
exec("cd .. && make deploy-from-watch", (err, stdout, stderr) => {
if (stdout) {
process.stdout.write(stdout);
}
if (stderr) {
process.stderr.write(stderr);
}
});
});
},
});
}
const config = {
entry: [
"./src/index.tsx",
],
resolve: {
alias: {
"@": path.resolve(__dirname, "src"),
},
modules: [
"src",
"node_modules",
path.resolve(__dirname),
],
extensions: ["*", ".js", ".jsx", ".ts", ".tsx"],
},
module: {
rules: [
{
test: /\.(js|jsx|ts|tsx)$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
cacheDirectory: true,
// Babel configuration is in babel.config.js because jest requires it to be there.
},
},
},
{
test: /\.(scss|css)$/,
use: [
"style-loader",
{
loader: "css-loader",
},
{
loader: "sass-loader",
options: {
sassOptions: {
includePaths: ["node_modules/compass-mixins/lib", "sass"],
},
},
},
],
},
],
},
externals: {
"react": "React",
"react-dom": "ReactDOM",
"react-intl": "ReactIntl",
"redux": "Redux",
"react-redux": "ReactRedux",
"react-bootstrap": "ReactBootstrap",
"react-router-dom": "ReactRouterDom",
"prop-types": "PropTypes",
"luxon": "Luxon",
"styled-components": "StyledComponents",
},
output: {
devtoolNamespace: PLUGIN_ID,
path: path.join(__dirname, "/dist"),
publicPath: "/",
filename: "main.js",
},
mode: (isDev) ? "inline-source-map" : "production",
plugins,
};
if (isDev) {
Object.assign(config, {
devServer: {
// hot: true,
port: 3004,
},
devtool: "inline-source-map",
});
} else {
config.optimization = {
usedExports: true,
minimizer: [new UglifyJsPlugin()],
};
config.stats = 'detailed';
}
module.exports = config;