Generic Configuration

Author: jayfo

.gitignore

@@ -0,0 +1,9 @@
+# IDE configuration
+.idea
+
+# Build files
+/build
+/dist
+
+# Node dependencies
+/node_modules

config/webpack.common.js

@@ -0,0 +1,83 @@
+const paths = require('./paths');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
+
+module.exports = {
+    entry: {
+        app: [paths.appIndex],
+    },
+
+    // Extensions Webpack will resolve when files import other files
+    resolve: {
+        extensions: ['.tsx', '.ts', '.js'],
+        plugins: [new TsconfigPathsPlugin({ configFile: paths.tsconfig })],
+    },
+
+    output: {
+        filename: '[name].[fullhash].js',
+    },
+
+    module: {
+        rules: [
+            // Primary Typescript loader, loading .tsx or .ts
+            {
+                test: /\.tsx?$/,
+                use: [
+                    {
+                        loader: 'babel-loader',
+                        options: {
+                            presets: ['@babel/env', '@babel/react'],
+                        },
+                    },
+                    'ts-loader',
+                ],
+                exclude: "/node_modules/",
+            },
+            // MDX loader, loading .mdx
+            {
+                test: /\.mdx$/,
+                use: [
+                    {
+                        loader: 'babel-loader',
+                        options: {
+                            presets: ['@babel/env', '@babel/react']
+                        }
+                    },
+                    {
+                        loader: '@mdx-js/loader',
+                        options: {
+                            providerImportSource: '@mdx-js/react'
+                        }
+                    }
+                ],
+                exclude: "/node_modules/",
+            },
+            // Image and File resources from the site
+            {
+                test: /\.(jpg|pdf|png|pptx)$/,
+                type: 'asset/resource',
+                generator: {
+                    filename: 'assets/site/[name][ext]'
+                },
+                exclude: "/projects/",
+            },
+            // Image and File resources from projects
+            {
+                test: /\.(jpg|pdf|png|pptx)$/,
+                type: 'asset/resource',
+                generator: {
+                    filename: 'assets/projects/[path]/[name][ext]'
+                },
+            },
+        ],
+    },
+
+    plugins: [
+        new HtmlWebpackPlugin({
+            // Configuration:  https://github.com/jantimon/html-webpack-plugin
+            template: paths.appIndexTemplate,
+            // base: Not needed, due to publicPath defined in output
+            // publicPath: Not needed, due to publicPath defined in output
+        }),
+    ],
+};

config/webpack.dev.js

@@ -0,0 +1,28 @@
+const paths = require('./paths');
+const webpack = require('webpack');
+
+const { merge } = require('webpack-merge');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+    mode: 'development',
+    devtool: 'inline-source-map',
+
+    entry: {
+        app: ['webpack-hot-middleware/client'],
+    },
+
+    output: {
+        path: paths.appBuildDev,
+        publicPath: paths.publicPathDev,
+    },
+
+    plugins: [
+        new webpack.DefinePlugin({
+            // Quotes around strings for compile-time text substitution
+            __PUBLICPATH__: "'" + paths.publicPathDev + "'",
+        }),
+        // Hot loading
+        new webpack.HotModuleReplacementPlugin(),
+    ],
+});

config/webpack.prod.js

@@ -0,0 +1,27 @@
+const paths = require('./paths');
+const webpack = require('webpack');
+
+const { merge } = require('webpack-merge');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+    mode: 'production',
+    devtool: 'source-map',
+
+    // Disable minification for easier debugging
+    optimization: {
+        minimize: false,
+    },
+
+    output: {
+        path: paths.appBuildProd,
+        publicPath: paths.publicPathProd,
+    },
+
+    plugins: [
+        new webpack.DefinePlugin({
+            // Quotes around strings for compile-time text substitution
+            __PUBLICPATH__: "'" + paths.publicPathProd + "'",
+        }),
+    ],
+});

scripts/dev_serve.js

@@ -0,0 +1,37 @@
+const express = require('express');
+const rimraf = require('rimraf');
+const webpack = require('webpack');
+const webpackDevMiddleware = require('webpack-dev-middleware');
+const webpackHotMiddleware = require('webpack-hot-middleware');
+
+const path = require('path');
+const paths = require('../config/paths');
+const webpackConfig = require(paths.webpackConfigDev);
+
+console.log(`Starting debug build with hot reloading.`);
+
+const app = express();
+const compiler = webpack(webpackConfig);
+
+rimraf.sync(paths.appBuildDev);
+
+app.use(
+    webpackDevMiddleware(compiler, {
+        publicPath: webpackConfig.output.publicPath,
+        writeToDisk: true,
+    })
+);
+
+app.use(webpackHotMiddleware(compiler));
+
+// All queries redirect to home, then app handles routing
+app.get('/*', function (req, res) {
+    res.sendFile(path.join(paths.appBuildDev, 'index.html'));
+});
+
+port = 3000;
+host = '127.0.0.1'
+server = app.listen(port, host);
+server.on('listening', function () {
+    console.log(`Listening on http://${server.address().address}:${server.address().port}/`);
+});

scripts/prod_build.js

@@ -0,0 +1,11 @@
+const rimraf = require('rimraf');
+const webpack = require('webpack');
+const paths = require('../config/paths');
+const webpackConfig = require(paths.webpackConfigProd);
+
+console.log(`Building production in ${paths.appBuildProd}.`);
+
+rimraf.sync(paths.appBuildProd);
+
+const compiler = webpack(webpackConfig);
+compiler.run();

tsconfig.json

@@ -0,0 +1,34 @@
+{
+    "compilerOptions": {
+        "baseUrl": ".",
+        "experimentalDecorators": true,
+        "importHelpers": true,
+        "jsx": "react",
+        "lib": ["es6", "dom"],
+        "module": "commonjs",
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "noUnusedLocals": true,
+        "noUnusedParameters": true,
+        "paths": {
+            "src/*": ["src/*"]
+        },
+        "preserveConstEnums": true,
+        "removeComments": true,
+        "sourceMap": true,
+        "strictNullChecks": true,
+        "target": "es6"
+    },
+    "include": [
+        "src/client/**/*",
+        "src/common/**/*",
+        "src/components/**/*",
+        "src/content/**/*",
+        "src/pages/**/*",
+        "src/stores/**/*",
+        "src/types/**/*"
+    ],
+    "exclude": [
+        "node_modules"
+    ]
+}