webpack: Move webpack configuration to web.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit is contained in:
Anders Kaseorg 2023-02-23 17:20:53 -08:00 committed by Tim Abbott
parent 23fd4f95f4
commit 0ef8e88b17
13 changed files with 105 additions and 103 deletions

View File

@ -15,6 +15,7 @@
], ],
"parser": "@babel/eslint-parser", "parser": "@babel/eslint-parser",
"parserOptions": { "parserOptions": {
"requireConfigFile": false,
"warnOnUnsupportedTypeScriptVersion": false, "warnOnUnsupportedTypeScriptVersion": false,
"sourceType": "unambiguous" "sourceType": "unambiguous"
}, },
@ -240,7 +241,11 @@
"no-console": "error" "no-console": "error"
}, },
"settings": { "settings": {
"import/resolver": "webpack" "import/resolver": {
"webpack": {
"config": "./web/webpack.config.ts"
}
}
} }
}, },
{ {

View File

@ -8,15 +8,15 @@ on:
paths: paths:
- .github/workflows/production-suite.yml - .github/workflows/production-suite.yml
- "**/migrations/**" - "**/migrations/**"
- babel.config.js
- manage.py - manage.py
- postcss.config.js
- puppet/** - puppet/**
- requirements/** - requirements/**
- scripts/** - scripts/**
- tools/** - tools/**
- web/babel.config.js
- web/postcss.config.js
- web/third/** - web/third/**
- webpack.config.ts - web/webpack.config.ts
- yarn.lock - yarn.lock
- zerver/worker/queue_processors.py - zerver/worker/queue_processors.py
- zerver/lib/push_notifications.py - zerver/lib/push_notifications.py

View File

@ -271,7 +271,7 @@ webpack plugin (`web/debug-require-webpack-plugin.ts`) that exposes
a version of the `require()` function to the development environment a version of the `require()` function to the development environment
browser console for this purpose. For example, you can access our browser console for this purpose. For example, you can access our
`people` module by evaluating `people` module by evaluating
`people = require("./web/src/people")`, or the third-party `lodash` `people = require("./src/people")`, or the third-party `lodash`
module with `_ = require("lodash")`. This mechanism is **not** a module with `_ = require("lodash")`. This mechanism is **not** a
stable API and should not be used for any purpose other than stable API and should not be used for any purpose other than
interactive debugging. interactive debugging.

View File

@ -200,7 +200,7 @@ new feature hard to miss.
browser session, and includes them in reports to the server, so that browser session, and includes them in reports to the server, so that
one can see cases where exceptions chained together. You can print one can see cases where exceptions chained together. You can print
this log from the browser console using this log from the browser console using
`blueslip = require("./web/src/blueslip"); blueslip.get_log()`. `blueslip = require("./src/blueslip"); blueslip.get_log()`.
Blueslip supports several error levels: Blueslip supports several error levels:

View File

@ -5,7 +5,7 @@ import os
import subprocess import subprocess
from typing import NoReturn from typing import NoReturn
os.chdir(os.path.join(os.path.dirname(__file__), "..")) os.chdir(os.path.join(os.path.dirname(__file__), "../web"))
def build_for_prod_or_puppeteer(quiet: bool) -> NoReturn: def build_for_prod_or_puppeteer(quiet: bool) -> NoReturn:
@ -15,7 +15,7 @@ def build_for_prod_or_puppeteer(quiet: bool) -> NoReturn:
with open("/proc/meminfo") as meminfo: with open("/proc/meminfo") as meminfo:
if int(next(meminfo).split()[1]) < 3 * 1024 * 1024: if int(next(meminfo).split()[1]) < 3 * 1024 * 1024:
webpack_args += ["--max-old-space-size=1536"] webpack_args += ["--max-old-space-size=1536"]
webpack_args += ["node_modules/.bin/webpack-cli", "--mode=production"] webpack_args += ["../node_modules/.bin/webpack-cli", "--mode=production"]
if quiet: if quiet:
webpack_args += ["--stats=errors-only"] webpack_args += ["--stats=errors-only"]
os.execvp(webpack_args[0], webpack_args) os.execvp(webpack_args[0], webpack_args)
@ -27,7 +27,7 @@ def build_for_dev_server(host: str, port: str, minify: bool, disable_host_check:
# This is our most dynamic configuration, which we use for our # This is our most dynamic configuration, which we use for our
# dev server. The key piece here is that we identify changes to # dev server. The key piece here is that we identify changes to
# files as devs make edits and serve new assets on the fly. # files as devs make edits and serve new assets on the fly.
webpack_args = ["node", "node_modules/.bin/webpack-cli", "serve"] webpack_args = ["node", "../node_modules/.bin/webpack-cli", "serve"]
webpack_args += [ webpack_args += [
# webpack-cli has a bug where it ignores --watch-poll with # webpack-cli has a bug where it ignores --watch-poll with
# multi-config, and we don't need the katex-cli part anyway. # multi-config, and we don't need the katex-cli part anyway.
@ -79,8 +79,8 @@ def build_for_dev_server(host: str, port: str, minify: bool, disable_host_check:
# We did a chdir to the root of the Zulip checkout above. # We did a chdir to the root of the Zulip checkout above.
for filepath in [ for filepath in [
"webpack.config.ts", "webpack.config.ts",
"web/webpack.assets.json", "webpack.assets.json",
"web/webpack.dev-assets.json", "webpack.dev-assets.json",
]: ]:
watch_manager.add_watch(filepath, pyinotify.IN_MODIFY) watch_manager.add_watch(filepath, pyinotify.IN_MODIFY)
event_notifier.loop() event_notifier.loop()
@ -100,17 +100,17 @@ def build_for_most_tests() -> None:
# configuration for ALL tests, but figuring out the full history here # configuration for ALL tests, but figuring out the full history here
# was out of the scope of the effort here to add some comments and # was out of the scope of the effort here to add some comments and
# clean up names. # clean up names.
with open("web/webpack.assets.json") as json_data: with open("webpack.assets.json") as json_data:
entries = json.load(json_data) entries = json.load(json_data)
with open("web/webpack.dev-assets.json") as json_data: with open("webpack.dev-assets.json") as json_data:
entries.update(json.load(json_data)) entries.update(json.load(json_data))
stat_data = { stat_data = {
"status": "done", "status": "done",
"chunks": {entry: [f"{entry}-stubentry.js"] for entry in entries}, "chunks": {entry: [f"{entry}-stubentry.js"] for entry in entries},
} }
directory = "var" directory = "../var"
if not os.path.exists(directory): if not os.path.exists(directory):
os.makedirs(directory) os.makedirs(directory)
with open(os.path.join(directory, "webpack-stats-test.json"), "w") as outfile: with open(os.path.join(directory, "webpack-stats-test.json"), "w") as outfile:

View File

@ -2,7 +2,7 @@
const path = require("path"); const path = require("path");
const {media_breakpoints} = require("./web/src/css_variables"); const {media_breakpoints} = require("./src/css_variables");
module.exports = ({file}) => ({ module.exports = ({file}) => ({
plugins: [ plugins: [

View File

@ -2,7 +2,7 @@
// This module is included from webpack in development mode. To access it from // This module is included from webpack in development mode. To access it from
// the browser console, run: // the browser console, run:
// var debug = require("./web/src/debug"); // var debug = require("./src/debug");
/* /*
debug.print_elapsed_time("foo", foo) debug.print_elapsed_time("foo", foo)

View File

@ -34,7 +34,7 @@ require("@babel/register")({
"babel-plugin-rewire-ts", "babel-plugin-rewire-ts",
["@babel/plugin-transform-modules-commonjs", {lazy: () => true}], ["@babel/plugin-transform-modules-commonjs", {lazy: () => true}],
], ],
root: path.resolve(__dirname, "../../.."), root: path.resolve(__dirname, "../.."),
}); });
// Create a helper function to avoid sneaky delays in tests. // Create a helper function to avoid sneaky delays in tests.

View File

@ -1,89 +1,86 @@
{ {
"activity": [ "activity": [
"./web/src/bundles/common", "./src/bundles/common",
"sorttable", "sorttable",
"./web/src/analytics/activity", "./src/analytics/activity",
"./web/styles/portico/activity.css" "./styles/portico/activity.css"
], ],
"billing": [ "billing": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/src/portico/landing-page", "./src/portico/landing-page",
"./web/styles/portico/landing_page.css", "./styles/portico/landing_page.css",
"./web/src/billing/helpers", "./src/billing/helpers",
"./web/src/billing/billing", "./src/billing/billing",
"./web/src/templates", "./src/templates",
"./web/src/loading", "./src/loading",
"./web/styles/portico/billing.css" "./styles/portico/billing.css"
], ],
"upgrade": [ "upgrade": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/src/portico/tippyjs", "./src/portico/tippyjs",
"./web/src/portico/landing-page", "./src/portico/landing-page",
"./web/styles/portico/landing_page.css", "./styles/portico/landing_page.css",
"./web/src/billing/helpers", "./src/billing/helpers",
"./web/src/billing/upgrade", "./src/billing/upgrade",
"./web/src/templates", "./src/templates",
"./web/src/loading", "./src/loading",
"./web/styles/portico/billing.css" "./styles/portico/billing.css"
], ],
"billing-event-status": [ "billing-event-status": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/styles/portico/landing_page.css", "./styles/portico/landing_page.css",
"./web/src/billing/event_status.js", "./src/billing/event_status.js",
"./web/src/billing/helpers", "./src/billing/helpers",
"./web/styles/portico/billing.css" "./styles/portico/billing.css"
], ],
"portico": ["./web/src/bundles/portico"], "portico": ["./src/bundles/portico"],
"error-styles": [ "error-styles": ["./third/bootstrap/css/bootstrap.css", "./styles/portico/portico_styles.css"],
"./web/third/bootstrap/css/bootstrap.css", "common": ["./src/bundles/common"],
"./web/styles/portico/portico_styles.css"
],
"common": ["./web/src/bundles/common"],
"help": [ "help": [
"./web/src/bundles/portico", "./src/bundles/portico",
"simplebar/dist/simplebar.css", "simplebar/dist/simplebar.css",
"simplebar", "simplebar",
"./web/src/portico/help", "./src/portico/help",
"./web/src/portico/tabbed-instructions" "./src/portico/tabbed-instructions"
], ],
"landing-page": [ "landing-page": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/src/portico/landing-page", "./src/portico/landing-page",
"./web/styles/portico/landing_page.css" "./styles/portico/landing_page.css"
], ],
"integrations": [ "integrations": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/src/portico/integrations", "./src/portico/integrations",
"./web/styles/portico/landing_page.css", "./styles/portico/landing_page.css",
"./web/styles/portico/integrations.css" "./styles/portico/integrations.css"
], ],
"communities": [ "communities": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/src/portico/communities", "./src/portico/communities",
"./web/styles/portico/landing_page.css", "./styles/portico/landing_page.css",
"./web/styles/portico/integrations.css" "./styles/portico/integrations.css"
], ],
"signup": ["./web/src/bundles/portico", "jquery-validation", "./web/src/portico/signup"], "signup": ["./src/bundles/portico", "jquery-validation", "./src/portico/signup"],
"register": ["./web/src/bundles/portico", "jquery-validation", "./web/src/portico/signup"], "register": ["./src/bundles/portico", "jquery-validation", "./src/portico/signup"],
"confirm-preregistrationuser": [ "confirm-preregistrationuser": [
"./web/src/bundles/common", "./src/bundles/common",
"./web/src/portico/confirm-preregistrationuser" "./src/portico/confirm-preregistrationuser"
], ],
"support": [ "support": [
"./web/src/bundles/common", "./src/bundles/common",
"sorttable", "sorttable",
"./web/src/analytics/activity", "./src/analytics/activity",
"./web/styles/portico/activity.css", "./styles/portico/activity.css",
"./web/src/analytics/support" "./src/analytics/support"
], ],
"desktop-login": ["./web/src/bundles/portico", "./web/src/portico/desktop-login"], "desktop-login": ["./src/bundles/portico", "./src/portico/desktop-login"],
"desktop-redirect": ["./web/src/bundles/portico", "./web/src/portico/desktop-redirect"], "desktop-redirect": ["./src/bundles/portico", "./src/portico/desktop-redirect"],
"stats": [ "stats": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/styles/portico/stats.css", "./styles/portico/stats.css",
"./web/src/stats/stats", "./src/stats/stats",
"tippy.js/dist/tippy.css" "tippy.js/dist/tippy.css"
], ],
"app": ["./web/src/bundles/app"], "app": ["./src/bundles/app"],
"digest": ["./web/src/bundles/portico"] "digest": ["./src/bundles/portico"]
} }

View File

@ -8,9 +8,9 @@ import MiniCssExtractPlugin from "mini-css-extract-plugin";
import type webpack from "webpack"; import type webpack from "webpack";
import BundleTracker from "webpack-bundle-tracker"; import BundleTracker from "webpack-bundle-tracker";
import DebugRequirePlugin from "./web/debug-require-webpack-plugin"; import DebugRequirePlugin from "./debug-require-webpack-plugin";
import assets from "./web/webpack.assets.json"; import assets from "./webpack.assets.json";
import dev_assets from "./web/webpack.dev-assets.json"; import dev_assets from "./webpack.dev-assets.json";
export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.Configuration[] => { export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.Configuration[] => {
const production: boolean = argv.mode === "production"; const production: boolean = argv.mode === "production";
@ -37,18 +37,18 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
: Object.fromEntries( : Object.fromEntries(
Object.entries({...assets, ...dev_assets}).map(([name, paths]) => [ Object.entries({...assets, ...dev_assets}).map(([name, paths]) => [
name, name,
[...paths, "./web/src/debug"], [...paths, "./src/debug"],
]), ]),
), ),
module: { module: {
rules: [ rules: [
{ {
test: require.resolve("./web/src/zulip_test"), test: require.resolve("./src/zulip_test"),
loader: "expose-loader", loader: "expose-loader",
options: {exposes: "zulip_test"}, options: {exposes: "zulip_test"},
}, },
{ {
test: require.resolve("./web/debug-require"), test: require.resolve("./debug-require"),
loader: "expose-loader", loader: "expose-loader",
options: {exposes: "require"}, options: {exposes: "require"},
}, },
@ -83,15 +83,15 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
{ {
test: /\.(js|ts)$/, test: /\.(js|ts)$/,
include: [ include: [
path.resolve(__dirname, "web/shared/src"), path.resolve(__dirname, "shared/src"),
path.resolve(__dirname, "web/src"), path.resolve(__dirname, "src"),
], ],
loader: "babel-loader", loader: "babel-loader",
}, },
// regular css files // regular css files
{ {
test: /\.css$/, test: /\.css$/,
exclude: path.resolve(__dirname, "web/styles"), exclude: path.resolve(__dirname, "styles"),
use: [ use: [
MiniCssExtractPlugin.loader, MiniCssExtractPlugin.loader,
{ {
@ -105,7 +105,7 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
// PostCSS loader // PostCSS loader
{ {
test: /\.css$/, test: /\.css$/,
include: path.resolve(__dirname, "web/styles"), include: path.resolve(__dirname, "styles"),
use: [ use: [
MiniCssExtractPlugin.loader, MiniCssExtractPlugin.loader,
{ {
@ -160,7 +160,7 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
], ],
}, },
output: { output: {
path: path.resolve(__dirname, "static/webpack-bundles"), path: path.resolve(__dirname, "../static/webpack-bundles"),
publicPath: "", publicPath: "",
filename: production ? "[name].[contenthash].js" : "[name].js", filename: production ? "[name].[contenthash].js" : "[name].js",
assetModuleFilename: production assetModuleFilename: production
@ -197,8 +197,8 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
new DebugRequirePlugin(), new DebugRequirePlugin(),
new BundleTracker({ new BundleTracker({
filename: production filename: production
? "webpack-stats-production.json" ? "../webpack-stats-production.json"
: "var/webpack-stats-dev.json", : "../var/webpack-stats-dev.json",
}), }),
// Extract CSS from files // Extract CSS from files
new MiniCssExtractPlugin({ new MiniCssExtractPlugin({
@ -207,7 +207,7 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
}), }),
new HtmlWebpackPlugin({ new HtmlWebpackPlugin({
filename: "5xx.html", filename: "5xx.html",
template: "web/html/5xx.html", template: "html/5xx.html",
chunks: ["error-styles"], chunks: ["error-styles"],
}), }),
], ],
@ -247,7 +247,7 @@ export default (env: {minimize?: boolean} = {}, argv: {mode?: string}): webpack.
"katex-cli": "shebang-loader!katex/cli", "katex-cli": "shebang-loader!katex/cli",
}, },
output: { output: {
path: path.resolve(__dirname, "static/webpack-bundles"), path: path.resolve(__dirname, "../static/webpack-bundles"),
}, },
}; };

View File

@ -1,17 +1,17 @@
{ {
"dev-login": ["./web/src/bundles/portico", "./web/src/portico/dev-login"], "dev-login": ["./src/bundles/portico", "./src/portico/dev-login"],
"dev-integrations-panel": [ "dev-integrations-panel": [
"./web/src/bundles/portico", "./src/bundles/portico",
"./web/src/portico/integrations_dev_panel", "./src/portico/integrations_dev_panel",
"./web/styles/portico/integrations_dev_panel.css", "./styles/portico/integrations_dev_panel.css",
"./web/src/reload_state", "./src/reload_state",
"./web/src/channel" "./src/channel"
], ],
"dev-email-log": [ "dev-email-log": [
"./web/src/bundles/common", "./src/bundles/common",
"./web/src/portico/email_log", "./src/portico/email_log",
"./web/styles/portico/email_log.css", "./styles/portico/email_log.css",
"./web/src/reload_state", "./src/reload_state",
"./web/src/channel" "./src/channel"
] ]
} }