mirror of
https://github.com/zebrajr/react.git
synced 2025-12-06 00:20:04 +01:00
67a61d5bd7
Builds on #26257. To do this we need access to a manifest for which scripts and CSS are used for each "page" (entrypoint). The initial script to bootstrap the app is inserted with `bootstrapScripts`. Subsequent content are loaded using the chunks mechanism built-in. The stylesheets for each pages are prepended to each RSC payload and rendered using Float. This doesn't yet support styles imported in components that are also SSR:ed nor imported through Server Components. That's more complex and not implemented in the node loader. HMR doesn't work after reloads right now because the SSR renderer isn't hot reloaded because there's no idiomatic way to hot reload ESM modules in Node.js yet. Without killing the HMR server. This leads to hydration mismatches when reloading the page after a hot reload. Notably this doesn't show serializing the stream through the HTML like real implementations do. This will lead to possible hydration mismatches based on the data. However, manually serializing the stream as a string isn't exactly correct due to binary data. It's not the idiomatic way this is supposed to work. This will all be built-in which will make this automatic in the future.
74 lines
2.3 KiB
JavaScript
74 lines
2.3 KiB
JavaScript
'use strict';
|
|
|
|
const path = require('path');
|
|
const fs = require('fs');
|
|
const getPublicUrlOrPath = require('react-dev-utils/getPublicUrlOrPath');
|
|
|
|
// Make sure any symlinks in the project folder are resolved:
|
|
// https://github.com/facebook/create-react-app/issues/637
|
|
const appDirectory = fs.realpathSync(process.cwd());
|
|
const resolveApp = relativePath => path.resolve(appDirectory, relativePath);
|
|
|
|
// We use `PUBLIC_URL` environment variable or "homepage" field to infer
|
|
// "public path" at which the app is served.
|
|
// webpack needs to know it to put the right <script> hrefs into HTML even in
|
|
// single-page apps that may serve index.html for nested URLs like /todos/42.
|
|
// We can't use a relative path in HTML because we don't want to load something
|
|
// like /todos/42/static/js/bundle.7289d.js. We have to know the root.
|
|
const publicUrlOrPath = getPublicUrlOrPath(
|
|
process.env.NODE_ENV === 'development',
|
|
require(resolveApp('package.json')).homepage,
|
|
process.env.PUBLIC_URL
|
|
);
|
|
|
|
const buildPath = process.env.BUILD_PATH || 'build';
|
|
|
|
const moduleFileExtensions = [
|
|
'web.mjs',
|
|
'mjs',
|
|
'web.js',
|
|
'js',
|
|
'web.ts',
|
|
'ts',
|
|
'web.tsx',
|
|
'tsx',
|
|
'json',
|
|
'web.jsx',
|
|
'jsx',
|
|
];
|
|
|
|
// Resolve file paths in the same order as webpack
|
|
const resolveModule = (resolveFn, filePath) => {
|
|
const extension = moduleFileExtensions.find(extension =>
|
|
fs.existsSync(resolveFn(`${filePath}.${extension}`))
|
|
);
|
|
|
|
if (extension) {
|
|
return resolveFn(`${filePath}.${extension}`);
|
|
}
|
|
|
|
return resolveFn(`${filePath}.js`);
|
|
};
|
|
|
|
// config after eject: we're in ./config/
|
|
module.exports = {
|
|
dotenv: resolveApp('.env'),
|
|
appPath: resolveApp('.'),
|
|
appBuild: resolveApp(buildPath),
|
|
appPublic: resolveApp('public'),
|
|
appIndexJs: resolveModule(resolveApp, 'src/index'),
|
|
appPackageJson: resolveApp('package.json'),
|
|
appSrc: resolveApp('src'),
|
|
appTsConfig: resolveApp('tsconfig.json'),
|
|
appJsConfig: resolveApp('jsconfig.json'),
|
|
yarnLockFile: resolveApp('yarn.lock'),
|
|
testsSetup: resolveModule(resolveApp, 'src/setupTests'),
|
|
appNodeModules: resolveApp('node_modules'),
|
|
appWebpackCache: resolveApp('node_modules/.cache'),
|
|
appTsBuildInfoFile: resolveApp('node_modules/.cache/tsconfig.tsbuildinfo'),
|
|
swSrc: resolveModule(resolveApp, 'src/service-worker'),
|
|
publicUrlOrPath,
|
|
};
|
|
|
|
module.exports.moduleFileExtensions = moduleFileExtensions;
|