diff --git a/.changeset/open-cases-happen.md b/.changeset/open-cases-happen.md new file mode 100644 index 00000000000..37ccf26dca8 --- /dev/null +++ b/.changeset/open-cases-happen.md @@ -0,0 +1,5 @@ +--- +'@clerk/chrome-extension': patch +--- + +Externalize all Stripe-related modules diff --git a/.changeset/slick-taxis-cut.md b/.changeset/slick-taxis-cut.md new file mode 100644 index 00000000000..44085986248 --- /dev/null +++ b/.changeset/slick-taxis-cut.md @@ -0,0 +1,5 @@ +--- +'@clerk/clerk-js': patch +--- + +Fully strip @stripe/stripe-js from non-RHC builds diff --git a/packages/chrome-extension/tsup.config.ts b/packages/chrome-extension/tsup.config.ts index f05c0a91df2..6a75787567b 100644 --- a/packages/chrome-extension/tsup.config.ts +++ b/packages/chrome-extension/tsup.config.ts @@ -17,7 +17,7 @@ export default defineConfig(overrideOptions => { legacyOutput: true, treeshake: true, noExternal: ['@clerk/clerk-react', '@clerk/shared'], - external: ['use-sync-external-store'], + external: ['use-sync-external-store', '@stripe/stripe-js', '@stripe/react-stripe-js'], define: { PACKAGE_NAME: `"${name}"`, PACKAGE_VERSION: `"${version}"`, diff --git a/packages/clerk-js/rspack.config.js b/packages/clerk-js/rspack.config.js index 53cb057a7bf..2a3f15caae6 100644 --- a/packages/clerk-js/rspack.config.js +++ b/packages/clerk-js/rspack.config.js @@ -405,11 +405,27 @@ const prodConfig = ({ mode, env, analysis }) => { }, }); + /** @type { () => (import('@rspack/core').Configuration) } */ + const commonForNoRHC = () => ({ + plugins: [ + new rspack.IgnorePlugin({ + resourceRegExp: /^@stripe\/stripe-js$/, + }), + new rspack.optimize.LimitChunkCountPlugin({ + maxChunks: 1, + }), + ], + optimization: { + splitChunks: false, + }, + }); + const clerkEsmNoRHC = merge( entryForVariant(variants.clerkNoRHC), common({ mode, disableRHC: true }), commonForProd(), commonForProdBundled(), + commonForNoRHC(), { experiments: { outputModule: true, @@ -418,17 +434,6 @@ const prodConfig = ({ mode, env, analysis }) => { filename: '[name].mjs', libraryTarget: 'module', }, - plugins: [ - // Include the lazy chunks in the bundle as well - // so that the final bundle can be imported and bundled again - // by a different bundler, eg the webpack instance used by react-scripts - new rspack.optimize.LimitChunkCountPlugin({ - maxChunks: 1, - }), - ], - optimization: { - splitChunks: false, - }, }, ); @@ -437,22 +442,12 @@ const prodConfig = ({ mode, env, analysis }) => { common({ mode, disableRHC: true }), commonForProd(), commonForProdBundled(), + commonForNoRHC(), { output: { filename: '[name].js', libraryTarget: 'commonjs', }, - plugins: [ - // Include the lazy chunks in the bundle as well - // so that the final bundle can be imported and bundled again - // by a different bundler, eg the webpack instance used by react-scripts - new rspack.optimize.LimitChunkCountPlugin({ - maxChunks: 1, - }), - ], - optimization: { - splitChunks: false, - }, }, ); diff --git a/scripts/search-for-rhc.mjs b/scripts/search-for-rhc.mjs index b46d044da82..981ec912b70 100644 --- a/scripts/search-for-rhc.mjs +++ b/scripts/search-for-rhc.mjs @@ -10,11 +10,12 @@ import { $, argv } from 'zx'; const targetType = argv._[0]; // file | directory const target = argv._[1]; // Target of the resource -async function asyncSearchRHC(name, search) { +async function asyncSearchRHC(name, search, regex = false) { + const flag = regex ? 'E' : 'F'; const cmd = () => targetType === 'directory' - ? $`grep -rFq --include=\\*.js --include=\\*.mjs "${search}" ${target}` - : $`grep -Fq "${search}" ${target}`; + ? $`grep -${flag}q --include=\\*.js --include=\\*.mjs ${search} ${target}` + : $`grep -${flag}q ${search} ${target}`; if ((await cmd().exitCode) === 0) { throw new Error(`Found ${name} related RHC in build output. (Search: \`${search}\`)`); @@ -28,6 +29,7 @@ await Promise.allSettled([ asyncSearchRHC('clerk-js Hotloading', '/npm/@clerk/clerk-js'), asyncSearchRHC('Google One Tap', 'accounts.google.com/gsi/client'), asyncSearchRHC('Stripe', 'js.stripe.com'), + asyncSearchRHC('Stripe import', 'import\s*"@stripe/stripe-js', true), // eslint-disable-line no-useless-escape ]).then(results => { const errors = results.filter(result => result.status === 'rejected').map(result => result.reason.message);