Improve and simplify webpack build

Ensure we use consistent hashing method for vendor bundle to avoid
unnecessary rebuilds.

Remove the `build_ko` npm script as we no longer need to support two
different locations for the build output. This was leftover from
some very early releases of the Dashboard. The webpack build output
should always be placed in the `kodata` folder. Update docs to reflect
the change.

docs/dev/README.md

@@ -52,31 +52,23 @@ git remote set-url --push upstream no_push
 _Adding the `upstream` remote sets you up nicely for regularly
 [syncing your fork](https://help.github.com/articles/syncing-a-fork/)._
 
-**Note:** If using Windows and you initially cloned your repo before this PR was merged: https://github.com/tektoncd/dashboard/pull/1707, you may need to clear your git cache to avoid line-ending problems when building the frontend.
-
-```
-git rm --cached -r .
-git reset --hard
-```
-
 ## Build the frontend
 
-First install and build the npm project.
-Install with a clean slate of dependencies, if a node_modules folder is already present in the project root it will be automatically removed before install.
+First install the required dependencies:
 
 ```bash
-npm ci 
+npm install
 ```
 
-There is a dedicated npm job for ko builds:
+Run the webpack build:
 
 ```bash
-npm run build_ko
+npm run build
 ```
 
 This will build the static resources and add them to the `kodata` directory.
 
-## Build the backend
+## Build the backend (optional: for local debugging)
 
 The backend uses `go modules` to manage its dependencies. To build the go backend, run:
 

package.json

@@ -7,7 +7,6 @@
     "bootstrap:ci": "lerna bootstrap --no-ci && lerna run prepare",
     "build": "webpack --config webpack.prod.js",
     "build:analyze": "webpack --config webpack.prod.js --profile --json > stats.json && npx webpack-bundle-analyzer stats.json dist/",
-    "build_ko": "webpack --config webpack.prod.js --output-path=./cmd/dashboard/kodata",
     "clean": "lerna clean --yes && lerna run clean && rimraf node_modules",
     "eslint:check": "eslint --print-config src/index.js | eslint-config-prettier-check",
     "i18n:extract": "node scripts/i18n/extractMessages.js",

tekton/build.yaml

@@ -19,4 +19,4 @@ spec:
 
         npm ci
         npm run bootstrap:ci
-        npm run build_ko
+        npm run build

test/presubmit-tests.sh

@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-# Copyright 2018-2021 The Tekton Authors
+# Copyright 2018-2022 The Tekton Authors
 #
 # Licensed under the Apache License, Version 2.0 (the "License");
 # you may not use this file except in compliance with the License.
@@ -97,7 +97,7 @@ function pre_unit_tests() {
 function pre_integration_tests() {
     local failed=0
     node_npm_install || failed=1
-    npm run build_ko || failed=1
+    npm run build || failed=1
     return ${failed}
 }
 

webpack.prod.js

@@ -1,5 +1,5 @@
 /*
-Copyright 2019-2021 The Tekton Authors
+Copyright 2019-2022 The Tekton Authors
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at
@@ -24,10 +24,11 @@ module.exports = merge(common({ mode }), {
   mode,
   output: {
     filename: '[name].[contenthash].js',
-    path: path.resolve(__dirname, 'dist'),
+    path: path.resolve(__dirname, 'cmd/dashboard/kodata'),
     publicPath: './'
   },
   optimization: {
+    moduleIds: 'deterministic',
     runtimeChunk: 'single',
     splitChunks: {
       cacheGroups: {