Skip to content

Commit de6946b

Browse files
williamsteinwilliamstein
committed
switch to rspack for next
See https://rspack.rs/guide/tech/next
1 parent a77db26 commit de6946b

File tree

3 files changed

+261
-63
lines changed

3 files changed

+261
-63
lines changed

‎src/packages/next/next.config.js

Lines changed: 68 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ const BASE_PATH = process.env.BASE_PATH ?? "/";
55
const basePath = BASE_PATH == "/" ? "" : BASE_PATH;
66

77
const { join, resolve } = require("path");
8+
const withRspack = require("next-rspack");
89

910
// Important! We include resolve('.') and basePath to avoid
1011
// any possibility of multiple cocalc installs or different base
@@ -17,65 +18,71 @@ const cacheDirectory = join(
1718

1819
const removeImports = require("next-remove-imports")();
1920

20-
module.exports = removeImports({
21-
basePath,
22-
swcMinify: true, // enable faster RUST-based minifier
23-
env: { BASE_PATH },
24-
reactStrictMode: false, // See https://github.com/ant-design/ant-design/issues/26136
25-
eslint: { ignoreDuringBuilds: true },
26-
// typescript: { ignoreBuildErrors: true },
27-
webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
28-
config.cache = {
29-
type: "filesystem",
30-
buildDependencies: {
31-
config: [__filename],
32-
},
33-
cacheDirectory,
34-
};
35-
// Webpack breaks without this pg-native alias, even though it's dead code,
36-
// due to how the pg module does package detection internally.
37-
config.resolve.alias["pg-native"] = ".";
38-
// These aliases are so we don't end up with two distinct copies
39-
// of React in our application, since this doesn't work at all!
40-
config.resolve.alias["react"] = resolve(__dirname, "node_modules", "react");
41-
config.resolve.alias["react-dom"] = resolve(
42-
__dirname,
43-
"node_modules",
44-
"react-dom",
45-
);
46-
config.ignoreWarnings = [
47-
// This yargs warning is caused by node-zendesk in the @cocalc/server package
48-
// being a generally bad citizen. Things seem to work fine (we barely use the
49-
// zendesk api anyways).
50-
{ module: /^\.\.\/server\/node_modules\/yargs.*/ },
51-
];
21+
module.exports = withRspack(
22+
removeImports({
23+
basePath,
24+
swcMinify: true, // enable faster RUST-based minifier
25+
env: { BASE_PATH },
26+
reactStrictMode: false, // See https://github.com/ant-design/ant-design/issues/26136
27+
eslint: { ignoreDuringBuilds: true },
28+
// typescript: { ignoreBuildErrors: true },
29+
webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
30+
config.cache = {
31+
type: "filesystem",
32+
buildDependencies: {
33+
config: [__filename],
34+
},
35+
cacheDirectory,
36+
};
37+
// Webpack breaks without this pg-native alias, even though it's dead code,
38+
// due to how the pg module does package detection internally.
39+
config.resolve.alias["pg-native"] = ".";
40+
// These aliases are so we don't end up with two distinct copies
41+
// of React in our application, since this doesn't work at all!
42+
config.resolve.alias["react"] = resolve(
43+
__dirname,
44+
"node_modules",
45+
"react",
46+
);
47+
config.resolve.alias["react-dom"] = resolve(
48+
__dirname,
49+
"node_modules",
50+
"react-dom",
51+
);
52+
config.ignoreWarnings = [
53+
// This yargs warning is caused by node-zendesk in the @cocalc/server package
54+
// being a generally bad citizen. Things seem to work fine (we barely use the
55+
// zendesk api anyways).
56+
{ module: /^\.\.\/server\/node_modules\/yargs.*/ },
57+
];
5258

53-
// Important: return the modified config
54-
return config;
55-
},
56-
experimental: {
57-
// This is because the debug module color support would otherwise log this warning constantly:
58-
// Module not found: ESM packages (supports-color) need to be imported. Use 'import' to
59-
// reference the package instead. https://nextjs.org/docs/messages/import-esm-externals
60-
// esmExternals: "loose", // not supported by turbopack
61-
// We raise largePageDataBytes since this was recently added, and breaks a lot of SSR rendering
62-
// for cocalc share server. By default this is 128 * 1000 = "128KB", and we are changing it to
63-
// 128 * 1000 * 15 = "1MB" for now. TODO: Obviously, it would be nice to fix the root causes of this
64-
// being too big, but that's for another day, since our production website is broken right now.
65-
largePageDataBytes: 128 * 1000 * 10,
66-
// If you click the back button in the browser, it should go back to the previous page and restore the scroll position.
67-
// With Next.js in the loop, this doesn't happen by default.
68-
// besides the ticket about this, here is a blogpost about this
69-
// https://www.joshwcomeau.com/react/nextjs-scroll-restoration/
70-
scrollRestoration: true,
71-
// https://nextjs.org/docs/app/building-your-application/optimizing/memory-usage#webpack-build-worker
72-
webpackBuildWorker: true,
73-
},
74-
// For i18n, see https://nextjs.org/docs/advanced-features/i18n-routing
75-
// We are doing this at all since it improves our Lighthouse accessibility score.
76-
i18n: {
77-
locales: ["en-US"],
78-
defaultLocale: "en-US",
79-
},
80-
poweredByHeader: false, // https://github.com/sagemathinc/cocalc/issues/6101
81-
});
59+
// Important: return the modified config
60+
return config;
61+
},
62+
experimental: {
63+
// This is because the debug module color support would otherwise log this warning constantly:
64+
// Module not found: ESM packages (supports-color) need to be imported. Use 'import' to
65+
// reference the package instead. https://nextjs.org/docs/messages/import-esm-externals
66+
// esmExternals: "loose", // not supported by turbopack
67+
// We raise largePageDataBytes since this was recently added, and breaks a lot of SSR rendering
68+
// for cocalc share server. By default this is 128 * 1000 = "128KB", and we are changing it to
69+
// 128 * 1000 * 15 = "1MB" for now. TODO: Obviously, it would be nice to fix the root causes of this
70+
// being too big, but that's for another day, since our production website is broken right now.
71+
largePageDataBytes: 128 * 1000 * 10,
72+
// If you click the back button in the browser, it should go back to the previous page and restore the scroll position.
73+
// With Next.js in the loop, this doesn't happen by default.
74+
// besides the ticket about this, here is a blogpost about this
75+
// https://www.joshwcomeau.com/react/nextjs-scroll-restoration/
76+
scrollRestoration: true,
77+
// https://nextjs.org/docs/app/building-your-application/optimizing/memory-usage#webpack-build-worker
78+
webpackBuildWorker: true,
79+
},
80+
// For i18n, see https://nextjs.org/docs/advanced-features/i18n-routing
81+
// We are doing this at all since it improves our Lighthouse accessibility score.
82+
i18n: {
83+
locales: ["en-US"],
84+
defaultLocale: "en-US",
85+
},
86+
poweredByHeader: false, // https://github.com/sagemathinc/cocalc/issues/6101
87+
}),
88+
);

‎src/packages/next/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,7 @@
101101
"@types/react": "^19.1.8",
102102
"@types/react-dom": "^19.1.6",
103103
"@uiw/react-textarea-code-editor": "^3.1.1",
104+
"next-rspack": "^15.3.4",
104105
"node-mocks-http": "^1.14.1",
105106
"react-test-renderer": "^19.1.0"
106107
},

0 commit comments

Comments
 (0)