diff --git a/.prettierrc.js b/.prettierrc.js index 37cf9c9d3a89b..411a3d5a59440 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -13,7 +13,7 @@ module.exports = { arrowParens: 'avoid', overrides: [ { - files: ['*.code-workspace'], + files: ['*.code-workspace', '*.json'], options: { parser: 'json-stringify', }, diff --git a/fixtures/view-transition/.gitignore b/fixtures/view-transition/.gitignore new file mode 100644 index 0000000000000..c8a733615b973 --- /dev/null +++ b/fixtures/view-transition/.gitignore @@ -0,0 +1,2 @@ +.vercel +.env*.local diff --git a/fixtures/view-transition/README.md b/fixtures/view-transition/README.md index 7f5642ee9c4c3..6d2feeeea8e25 100644 --- a/fixtures/view-transition/README.md +++ b/fixtures/view-transition/README.md @@ -28,3 +28,11 @@ yarn start:prod ``` This will pre-build all static resources and then start a server-side rendering HTTP server that hosts the React app and service the static resources (without hot reloading). + +## Deploy + +Deployed to https://react-fixture-view-transition-six.vercel.app +Dashboard: https://vercel.com/react-fixtures/react-fixture-view-transition. + +Ask a member of React Core team for access if you need it. +Deployments should be public and happen automatically on PRs except those only targetting `compiler/`. diff --git a/fixtures/view-transition/package.json b/fixtures/view-transition/package.json index 7b9af04096027..a0366ac556801 100644 --- a/fixtures/view-transition/package.json +++ b/fixtures/view-transition/package.json @@ -4,13 +4,15 @@ "private": true, "devDependencies": { "concurrently": "3.1.0", - "http-proxy-middleware": "3.0.3", - "react-scripts": "5.0.1", - "@babel/plugin-proposal-private-property-in-object": "7.21.11" + "react-scripts": "5.0.1" }, "dependencies": { + "@babel/core": "7.26.0", + "@babel/plugin-proposal-private-property-in-object": "7.21.11", "@babel/register": "^7.25.9", + "babel-preset-react-app": "10.0.1", "express": "^4.14.0", + "http-proxy-middleware": "3.0.3", "ignore-styles": "^5.0.1", "react": "^19.0.0", "react-dom": "^19.0.0" @@ -30,6 +32,8 @@ "dev:server": "NODE_ENV=development node server", "start": "react-scripts build && NODE_ENV=production node server", "build": "react-scripts build", + "postinstall": "cp -r ../../build/oss-experimental/* ./node_modules/", + "vc-build": "node scripts/vercel-build.js", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" }, diff --git a/fixtures/view-transition/scripts/vercel-build.js b/fixtures/view-transition/scripts/vercel-build.js new file mode 100644 index 0000000000000..f63a509a4f1d7 --- /dev/null +++ b/fixtures/view-transition/scripts/vercel-build.js @@ -0,0 +1,88 @@ +const childProcess = require('child_process'); +const fs = require('fs/promises'); +const path = require('path'); + +/** + * vite-plugin-ssr for create-react-app + */ +async function main() { + const projectDir = path.resolve(__dirname, '..'); + const craBuildDir = path.join(projectDir, 'build'); + + const buildOutputDir = path.join(projectDir, '.vercel/output'); + const buildStaticOutputDir = path.join(buildOutputDir, 'static'); + const buildFunctionsOutputDir = path.join(buildOutputDir, 'functions'); + + childProcess.execSync('yarn build', {stdio: 'inherit'}); + // reduce amount of n_m shipped + childProcess.execSync('yarn install --production', {stdio: 'inherit'}); + + await fs.rm(buildOutputDir, {recursive: true, force: true}); + await fs.mkdir(buildOutputDir, {recursive: true}); + + await fs.cp( + path.join(craBuildDir, 'static'), + path.join(buildStaticOutputDir, 'static'), + { + recursive: true, + } + ); + + const indexFunctionDir = path.join(buildFunctionsOutputDir, 'index.func'); + await fs.mkdir(indexFunctionDir, {recursive: true}); + const indexFunctionConfig = { + handler: 'server/index.js', + launcherType: 'Nodejs', + runtime: 'nodejs22.x', + environment: {}, + }; + await fs.writeFile( + path.join(indexFunctionDir, '.vc-config.json'), + JSON.stringify(indexFunctionConfig, null, 2) + ); + await fs.cp( + path.join(projectDir, 'package.json'), + path.join(indexFunctionDir, 'package.json'), + { + recursive: true, + } + ); + await fs.cp( + path.join(projectDir, 'build'), + path.join(indexFunctionDir, 'build'), + { + recursive: true, + } + ); + await fs.cp( + path.join(projectDir, 'node_modules'), + path.join(indexFunctionDir, 'node_modules'), + { + recursive: true, + } + ); + await fs.cp( + path.join(projectDir, 'server'), + path.join(indexFunctionDir, 'server'), + { + recursive: true, + } + ); + await fs.cp( + path.join(projectDir, 'src'), + path.join(indexFunctionDir, 'src'), + { + recursive: true, + } + ); + + const buildOutputConfig = { + version: 3, + }; + await fs.writeFile( + path.join(buildOutputDir, 'config.json'), + JSON.stringify(buildOutputConfig, null, 2) + ); +} + +main(); diff --git a/fixtures/view-transition/yarn.lock b/fixtures/view-transition/yarn.lock index 76a6af00ca2ef..6cb1e41eb0927 100644 --- a/fixtures/view-transition/yarn.lock +++ b/fixtures/view-transition/yarn.lock @@ -38,7 +38,7 @@ resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.26.3.tgz#99488264a56b2aded63983abd6a417f03b92ed02" integrity sha512-nHIxvKPniQXpmQLb0vhY3VaFb3S0YrTAwpOWJZh1wn3oJPjJk9Asva204PsBdmAE8vpzfHudT8DB0scYvy9q0g== -"@babel/core@^7.1.0", "@babel/core@^7.11.1", "@babel/core@^7.12.3", "@babel/core@^7.16.0", "@babel/core@^7.7.2", "@babel/core@^7.8.0": +"@babel/core@7.26.0", "@babel/core@^7.1.0", "@babel/core@^7.11.1", "@babel/core@^7.12.3", "@babel/core@^7.16.0", "@babel/core@^7.7.2", "@babel/core@^7.8.0": version "7.26.0" resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.26.0.tgz#d78b6023cc8f3114ccf049eb219613f74a747b40" integrity sha512-i1SLeK+DzNnQ3LL/CswPCa/E5u4lh1k6IAEphON8F+cXt0t9euTshDru0q7/IqMa1PMPz5RnHuHscF8/ZJsStg== @@ -2805,7 +2805,7 @@ babel-preset-jest@^27.5.1: babel-plugin-jest-hoist "^27.5.1" babel-preset-current-node-syntax "^1.0.0" -babel-preset-react-app@^10.0.1: +babel-preset-react-app@10.0.1, babel-preset-react-app@^10.0.1: version "10.0.1" resolved "https://registry.yarnpkg.com/babel-preset-react-app/-/babel-preset-react-app-10.0.1.tgz#ed6005a20a24f2c88521809fa9aea99903751584" integrity sha512-b0D9IZ1WhhCWkrTXyFuIIgqGzSkRIH5D5AmB0bXbzYAB1OBAwHcUeyWW2LorutLWF5btNo/N7r/cIdmvvKJlYg== @@ -8598,7 +8598,16 @@ string-natural-compare@^3.0.1: resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4" integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw== -"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0: +"string-width-cjs@npm:string-width@^4.2.0": + version "4.2.3" + resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" + integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== + dependencies: + emoji-regex "^8.0.0" + is-fullwidth-code-point "^3.0.0" + strip-ansi "^6.0.1" + +string-width@^4.1.0, string-width@^4.2.0: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -8707,7 +8716,7 @@ stringify-object@^3.3.0: is-obj "^1.0.1" is-regexp "^1.0.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1": version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -8721,6 +8730,13 @@ strip-ansi@^0.3.0: dependencies: ansi-regex "^0.2.1" +strip-ansi@^6.0.0, strip-ansi@^6.0.1: + version "6.0.1" + resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" + integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== + dependencies: + ansi-regex "^5.0.1" + strip-ansi@^7.0.1: version "7.1.0" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-7.1.0.tgz#d5b6568ca689d8561370b0707685d22434faff45" @@ -9744,7 +9760,16 @@ workbox-window@6.6.1: "@types/trusted-types" "^2.0.2" workbox-core "6.6.1" -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": + version "7.0.0" + resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" + integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== + dependencies: + ansi-styles "^4.0.0" + string-width "^4.1.0" + strip-ansi "^6.0.0" + +wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== diff --git a/package.json b/package.json index 0fcb952cc6f6d..a3156c1c2c814 100644 --- a/package.json +++ b/package.json @@ -125,6 +125,7 @@ "build-for-devtools-prod": "yarn build-for-devtools --type=NODE_PROD", "build-for-flight-dev": "cross-env RELEASE_CHANNEL=experimental node ./scripts/rollup/build.js react/index,react/jsx,react.react-server,react-dom/index,react-dom/client,react-dom/server,react-dom.react-server,react-dom-server.node,react-dom-server-legacy.node,scheduler,react-server-dom-webpack/ --type=NODE_DEV,ESM_PROD,NODE_ES2015 && mv ./build/node_modules ./build/oss-experimental", "build-for-vt-dev": "cross-env RELEASE_CHANNEL=experimental node ./scripts/rollup/build.js react/index,react/jsx,react-dom/index,react-dom/client,react-dom/server,react-dom-server.node,react-dom-server-legacy.node,scheduler --type=NODE_DEV && mv ./build/node_modules ./build/oss-experimental", + "build-for-vt-deploy": "cross-env RELEASE_CHANNEL=experimental node ./scripts/rollup/build.js react/index,react/jsx,react-dom/index,react-dom/client,react-dom/server,react-dom-server.node,react-dom-server-legacy.node,scheduler --type=NODE_PROD && mv ./build/node_modules ./build/oss-experimental", "linc": "node ./scripts/tasks/linc.js", "lint": "node ./scripts/tasks/eslint.js", "lint-build": "node ./scripts/rollup/validate/index.js",