feat: Make builds produce sourcemaps when NODE_ENV is not production

Co-authored-by: Janne Savolainen <janne.savolainen@live.fi>

Signed-off-by: Mikko Aspiala <mikko.aspiala@gmail.com>
Signed-off-by: Iku-turso <mikko.aspiala@gmail.com>

packages/infrastructure/webpack/src/__snapshots__/get-multi-export-config.test.ts.snap

@@ -7,6 +7,7 @@ exports[`get-multi-export-config given maximal package.json, when creating confi
     entry: { index: './index.ts' },
     target: 'node',
     mode: 'production',
+    devtool: false,
     performance: { maxEntrypointSize: 100000, hints: 'error' },
     resolve: { extensions: [ '.ts', '.tsx', '.js' ] },
     plugins: [
@@ -42,6 +43,7 @@ exports[`get-multi-export-config given maximal package.json, when creating confi
     entry: { index: './some-entrypoint/index.ts' },
     target: 'node',
     mode: 'production',
+    devtool: false,
     performance: { maxEntrypointSize: 100000, hints: 'error' },
     resolve: { extensions: [ '.ts', '.tsx', '.js' ] },
     plugins: [
@@ -77,6 +79,7 @@ exports[`get-multi-export-config given maximal package.json, when creating confi
     entry: { index: './some-other-entrypoint/index.ts' },
     target: 'node',
     mode: 'production',
+    devtool: false,
     performance: { maxEntrypointSize: 100000, hints: 'error' },
     resolve: { extensions: [ '.ts', '.tsx', '.js' ] },
     plugins: [

packages/infrastructure/webpack/src/__snapshots__/get-node-config.test.ts.snap

@@ -0,0 +1,67 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`get-node-config given an environment, works 1`] = `
+{
+  "devtool": "some-devtool",
+  "entry": {
+    "index": "some-entrypoint-file-path",
+  },
+  "externalsPresets": {
+    "node": true,
+  },
+  "mode": "development",
+  "module": {
+    "rules": [
+      {
+        "loader": "ts-loader",
+        "test": /\\\\\\.ts\\(x\\)\\?\\$/,
+      },
+    ],
+  },
+  "name": "some-entrypoint-file-path",
+  "node": {
+    "__dirname": true,
+    "__filename": true,
+  },
+  "output": {
+    "filename": [Function],
+    "library": {
+      "type": "commonjs2",
+    },
+    "path": "some-output-directory",
+  },
+  "performance": {
+    "hints": "error",
+    "maxEntrypointSize": 100000,
+  },
+  "plugins": [
+    MakePeerDependenciesExternalPlugin {},
+    ProtectFromImportingNonDependencies {},
+    ForkTsCheckerWebpackPlugin {
+      "options": {
+        "typescript": {
+          "configOverwrite": {
+            "compilerOptions": {
+              "declaration": true,
+              "declarationDir": "some-output-directory",
+            },
+            "include": [
+              "some-entrypoint-file-path",
+            ],
+          },
+          "mode": "write-dts",
+        },
+      },
+    },
+    LinkablePushPlugin {},
+  ],
+  "resolve": {
+    "extensions": [
+      ".ts",
+      ".tsx",
+      ".js",
+    ],
+  },
+  "target": "node",
+}
+`;

packages/infrastructure/webpack/src/get-multi-export-config.test.ts

@@ -64,6 +64,11 @@ describe("get-multi-export-config", () => {
         getReactConfig: getReactConfigFor({
           miniCssExtractPluginLoader: "miniCssExtractPluginLoader",
         }),
+
+        environment: {
+          mode: "production",
+          devtool: false
+        }
       });
     });
 

packages/infrastructure/webpack/src/get-multi-export-config.ts

@@ -14,11 +14,13 @@ import { pipeline } from "@ogre-tools/fp";
 import path from "path";
 import { getReactConfigFor } from "./get-react-config-for";
 import { getNodeConfig } from "./get-node-config";
+import { Environment, environment } from "./runtime-values/environment";
 
 type Dependencies = {
   resolvePath: typeof path.resolve;
   workingDirectory: string;
   getReactConfig: ReturnType<typeof getReactConfigFor>;
+  environment: Environment;
 };
 
 export const getMultiExportConfig = (
@@ -29,6 +31,7 @@ export const getMultiExportConfig = (
     resolvePath: path.resolve,
     workingDirectory: process.cwd(),
     getReactConfig: getReactConfigFor(),
+    environment,
     ..._dependencies,
   };
 
@@ -140,9 +143,11 @@ const toExportSpecificWebpackConfigFor =
       ? getNodeConfig({
           entrypointFilePath: entrypoint,
           outputDirectory,
+          environment: dependencies.environment,
         })
       : dependencies.getReactConfig!({
           entrypointFilePath: entrypoint,
           outputDirectory,
+          environment: dependencies.environment,
         });
   };

packages/infrastructure/webpack/src/get-node-config.test.ts

@@ -0,0 +1,13 @@
+import { getNodeConfig } from "./get-node-config";
+
+describe("get-node-config", () => {
+  it("given an environment, works", () => {
+    const actual = getNodeConfig({
+      entrypointFilePath: "some-entrypoint-file-path",
+      outputDirectory: "some-output-directory",
+      environment: { mode: "development", devtool: "some-devtool" },
+    });
+
+    expect(actual).toMatchSnapshot();
+  });
+});

packages/infrastructure/webpack/src/get-node-config.ts

@@ -3,20 +3,24 @@ import type { Configuration } from "webpack";
 import { MakePeerDependenciesExternalPlugin } from "./plugins/make-peer-dependencies-external";
 import { ProtectFromImportingNonDependencies } from "./plugins/protect-from-importing-non-dependencies";
 import { LinkablePushPlugin } from "./plugins/linkable-push-plugin";
+import type { Environment } from "./runtime-values/environment";
 
-export type Paths = {
+export type GetNodeConfigParams = {
   entrypointFilePath: string;
   outputDirectory: string;
+  environment: Environment;
 };
 
 export const getNodeConfig = ({
   entrypointFilePath,
   outputDirectory,
-}: Paths): Configuration => ({
+  environment,
+}: GetNodeConfigParams): Configuration => ({
   name: entrypointFilePath,
   entry: { index: entrypointFilePath },
   target: "node",
-  mode: "production",
+  mode: environment.mode,
+  devtool: environment.devtool,
 
   performance: {
     maxEntrypointSize: 100000,

packages/infrastructure/webpack/src/get-react-config-for.ts

@@ -1,13 +1,14 @@
-import { getNodeConfig, Paths } from "./get-node-config";
+import { getNodeConfig, GetNodeConfigParams } from "./get-node-config";
 import MiniCssExtractPlugin from "mini-css-extract-plugin";
 import type { Configuration } from "webpack";
 
 export const getReactConfigFor =
   ({ miniCssExtractPluginLoader = MiniCssExtractPlugin.loader } = {}) =>
-  ({ entrypointFilePath, outputDirectory }: Paths): Configuration => {
+  ({ entrypointFilePath, outputDirectory, environment }: GetNodeConfigParams): Configuration => {
     const nodeConfig = getNodeConfig({
       entrypointFilePath,
       outputDirectory,
+      environment
     });
 
     return {

packages/infrastructure/webpack/src/node-config.ts

@@ -1,7 +1,10 @@
-import path from "path";
 import { getNodeConfig } from "./get-node-config";
+import { environment } from "./runtime-values/environment";
+import { entrypointFilePath } from "./runtime-values/entrypoint-file-path";
+import { outputDirectory } from "./runtime-values/output-directory";
 
 export const configForNode = getNodeConfig({
-  entrypointFilePath: "./index.ts",
+  entrypointFilePath,
-  outputDirectory: path.resolve(process.cwd(), "dist"),
+  outputDirectory,
+  environment,
 });

packages/infrastructure/webpack/src/react-config.ts

@@ -1,7 +1,10 @@
-import path from "path";
 import { getReactConfigFor } from "./get-react-config-for";
+import { environment } from "./runtime-values/environment";
+import { outputDirectory } from "./runtime-values/output-directory";
+import { entrypointFilePath } from "./runtime-values/entrypoint-file-path";
 
 export const configForReact = getReactConfigFor()({
-  entrypointFilePath: "./index.ts",
+  entrypointFilePath,
-  outputDirectory: path.resolve(process.cwd(), "dist"),
+  outputDirectory,
+  environment,
 });

packages/infrastructure/webpack/src/runtime-values/entrypoint-file-path.ts

@@ -0,0 +1 @@
+export const entrypointFilePath = "./index.ts";

packages/infrastructure/webpack/src/runtime-values/environment.ts

@@ -0,0 +1,19 @@
+export type Environment = {
+  mode: "production" | "development";
+  devtool: false | string;
+};
+
+const environment: Environment =
+  // Usage of indexers is deliberate to make webpack use runtime env-variables
+  // instead of compile-time ones.
+  process["env"]["NODE_ENV"] === "development"
+    ? {
+        mode: "development",
+        devtool: "eval-cheap-source-map",
+      }
+    : {
+        mode: "production",
+        devtool: false,
+      };
+
+export { environment };

packages/infrastructure/webpack/src/runtime-values/output-directory.ts

@@ -0,0 +1,3 @@
+import path from "path";
+
+export const outputDirectory = path.resolve(process.cwd(), "dist");