Merge branch 'canary' into fix/gsp-compile-query

.github/actions/next-stats-action/package.json

@@ -4,7 +4,6 @@
   "dependencies": {
     "async-sema": "^3.1.0",
     "execa": "2.0.3",
-    "fs-extra": "^8.1.0",
     "get-port": "^5.0.0",
     "glob": "^7.1.4",
     "gzip-size": "^5.1.1",

.github/actions/next-stats-action/src/index.js

@@ -1,5 +1,6 @@
 const path = require('path')
-const fs = require('fs-extra')
+const fs = require('fs/promises')
+const { existsSync } = require('fs')
 const exec = require('./util/exec')
 const logger = require('./util/logger')
 const runConfigs = require('./run')
@@ -21,7 +22,7 @@ if (!allowedActions.has(actionInfo.actionName) && !actionInfo.isRelease) {
 
 ;(async () => {
   try {
-    if (await fs.pathExists(path.join(__dirname, '../SKIP_NEXT_STATS.txt'))) {
+    if (existsSync(path.join(__dirname, '../SKIP_NEXT_STATS.txt'))) {
       console.log(
         'SKIP_NEXT_STATS.txt file present, exiting stats generation..'
       )
@@ -100,7 +101,7 @@ if (!allowedActions.has(actionInfo.actionName) && !actionInfo.isRelease) {
     for (const dir of repoDirs) {
       logger(`Running initial build for ${dir}`)
       if (!actionInfo.skipClone) {
-        const usePnpm = await fs.pathExists(path.join(dir, 'pnpm-lock.yaml'))
+        const usePnpm = existsSync(path.join(dir, 'pnpm-lock.yaml'))
 
         if (!statsConfig.skipInitialInstall) {
           await exec.spawnPromise(
@@ -121,9 +122,10 @@ if (!allowedActions.has(actionInfo.actionName) && !actionInfo.isRelease) {
       }
 
       await fs
-        .copy(
+        .cp(
           path.join(__dirname, '../native'),
-          path.join(dir, 'packages/next-swc/native')
+          path.join(dir, 'packages/next-swc/native'),
+          { recursive: true, force: true }
         )
         .catch(console.error)
 

.github/actions/next-stats-action/src/prepare/repo-setup.js

@@ -1,16 +1,14 @@
 const path = require('path')
-const fse = require('fs-extra')
-const fs = require('fs')
-const fsp = require('fs/promises')
+const fs = require('fs/promises')
+const { existsSync } = require('fs')
 const exec = require('../util/exec')
-const { remove } = require('fs-extra')
 const logger = require('../util/logger')
 const execa = require('execa')
 
 module.exports = (actionInfo) => {
   return {
     async cloneRepo(repoPath = '', dest = '', branch = '', depth = '20') {
-      await remove(dest)
+      await fs.rm(dest, { recursive: true, force: true })
       await exec(
         `git clone ${actionInfo.gitRoot}${repoPath} --single-branch --branch ${branch} --depth=${depth} ${dest}`
       )
@@ -72,7 +70,7 @@ module.exports = (actionInfo) => {
       let pkgs
 
       try {
-        pkgs = await fsp.readdir(path.join(repoDir, 'packages'))
+        pkgs = await fs.readdir(path.join(repoDir, 'packages'))
       } catch (err) {
         if (err.code === 'ENOENT') {
           require('console').log('no packages to link')
@@ -87,8 +85,8 @@ module.exports = (actionInfo) => {
           const packedPkgPath = path.join(pkgPath, `${pkg}-packed.tgz`)
 
           const pkgDataPath = path.join(pkgPath, 'package.json')
-          if (fs.existsSync(pkgDataPath)) {
-            const pkgData = JSON.parse(await fsp.readFile(pkgDataPath))
+          if (existsSync(pkgDataPath)) {
+            const pkgData = JSON.parse(await fs.readFile(pkgDataPath))
             const { name } = pkgData
 
             pkgDatas.set(name, {
@@ -122,7 +120,7 @@ module.exports = (actionInfo) => {
           pkgData.files.push('native')
 
           try {
-            const swcBinariesDirContents = await fsp.readdir(
+            const swcBinariesDirContents = await fs.readdir(
               path.join(pkgPath, 'native')
             )
             require('console').log(
@@ -155,7 +153,7 @@ module.exports = (actionInfo) => {
           }
         }
 
-        await fsp.writeFile(
+        await fs.writeFile(
           pkgDataPath,
           JSON.stringify(pkgData, null, 2),
           'utf8'
@@ -186,9 +184,9 @@ module.exports = (actionInfo) => {
                 'disabled-native-gitignore'
               )
 
-              await fsp.rename(nativeGitignorePath, renamedGitignorePath)
+              await fs.rename(nativeGitignorePath, renamedGitignorePath)
               cleanup = async () => {
-                await fsp.rename(renamedGitignorePath, nativeGitignorePath)
+                await fs.rename(renamedGitignorePath, nativeGitignorePath)
               }
             }
 
@@ -201,7 +199,7 @@ module.exports = (actionInfo) => {
             })
 
             return Promise.all([
-              fsp.rename(path.resolve(pkgPath, stdout.trim()), packedPkgPath),
+              fs.rename(path.resolve(pkgPath, stdout.trim()), packedPkgPath),
               cleanup?.(),
             ])
           }

.github/actions/next-stats-action/src/run/collect-diffs.js

@@ -1,5 +1,6 @@
 const path = require('path')
-const fs = require('fs-extra')
+const fs = require('fs/promises')
+const { existsSync } = require('fs')
 const exec = require('../util/exec')
 const glob = require('../util/glob')
 const logger = require('../util/logger')
@@ -12,15 +13,17 @@ module.exports = async function collectDiffs(
   if (initial) {
     logger('Setting up directory for diffing')
     // set-up diffing directory
-    await fs.remove(diffingDir)
-    await fs.mkdirp(diffingDir)
+    await fs.rm(diffingDir, { recursive: true, force: true })
+    await fs.mkdir(diffingDir, { recursive: true })
     await exec(`cd ${diffingDir} && git init`)
   } else {
     // remove any previous files in case they won't be overwritten
     const toRemove = await glob('!(.git)', { cwd: diffingDir, dot: true })
 
     await Promise.all(
-      toRemove.map((file) => fs.remove(path.join(diffingDir, file)))
+      toRemove.map((file) =>
+        fs.rm(path.join(diffingDir, file), { recursive: true, force: true })
+      )
     )
   }
   const diffs = {}
@@ -40,7 +43,7 @@ module.exports = async function collectDiffs(
         const absPath = path.join(statsAppDir, file)
 
         const diffDest = path.join(diffingDir, file)
-        await fs.copy(absPath, diffDest)
+        await fs.cp(absPath, diffDest, { recursive: true, force: true })
       }
 
       if (curFiles.length > 0) {
@@ -75,7 +78,7 @@ module.exports = async function collectDiffs(
 
     for (const line of renamedFiles) {
       const [, prev, cur] = line.split('\t')
-      await fs.move(path.join(diffingDir, cur), path.join(diffingDir, prev))
+      await fs.rename(path.join(diffingDir, cur), path.join(diffingDir, prev))
       diffs._renames.push({
         prev,
         cur,
@@ -91,7 +94,7 @@ module.exports = async function collectDiffs(
 
     for (const file of changedFiles) {
       const fileKey = path.basename(file)
-      const hasFile = await fs.exists(path.join(diffingDir, file))
+      const hasFile = existsSync(path.join(diffingDir, file))
 
       if (!hasFile) {
         diffs[fileKey] = 'deleted'

.github/actions/next-stats-action/src/run/collect-stats.js

@@ -1,5 +1,5 @@
 const path = require('path')
-const fs = require('fs-extra')
+const fs = require('fs/promises')
 const getPort = require('get-port')
 const fetch = require('node-fetch')
 const glob = require('../util/glob')
@@ -84,7 +84,7 @@ module.exports = async function collectStats(
 
     if (hasPagesToFetch) {
       const fetchedPagesDir = path.join(curDir, 'fetched-pages')
-      await fs.mkdirp(fetchedPagesDir)
+      await fs.mkdir(fetchedPagesDir, { recursive: true })
 
       for (let url of runConfig.pagesToFetch) {
         url = url.replace('$PORT', port)

.github/actions/next-stats-action/src/run/get-dir-size.js

@@ -1,5 +1,5 @@
 const path = require('path')
-const fs = require('fs-extra')
+const fs = require('fs/promises')
 
 // getDirSize recursively gets size of all files in a directory
 async function getDirSize(dir, ctx = { size: 0 }) {

.github/actions/next-stats-action/src/run/index.js

@@ -1,5 +1,5 @@
 const path = require('path')
-const fs = require('fs-extra')
+const fs = require('fs/promises')
 const glob = require('../util/glob')
 const exec = require('../util/exec')
 const logger = require('../util/logger')
@@ -36,8 +36,8 @@ async function runConfigs(
       const curStatsAppPath = path.join(diffRepoDir, relativeStatsAppDir)
 
       // clean statsAppDir
-      await fs.remove(statsAppDir)
-      await fs.copy(curStatsAppPath, statsAppDir)
+      await fs.rm(statsAppDir, { recursive: true, force: true })
+      await fs.cp(curStatsAppPath, statsAppDir, { recursive: true })
 
       logger(`Copying ${curStatsAppPath} ${statsAppDir}`)
 
@@ -70,7 +70,7 @@ async function runConfigs(
             ? result.replace(/(\.|-)[0-9a-f]{16}(\.|-)/g, '$1HASH$2')
             : rename.dest
           if (result === dest) continue
-          await fs.move(
+          await fs.rename(
             path.join(statsAppDir, result),
             path.join(statsAppDir, dest)
           )
@@ -172,7 +172,10 @@ async function runConfigs(
 }
 
 async function linkPkgs(pkgDir = '', pkgPaths) {
-  await fs.remove(path.join(pkgDir, 'node_modules'))
+  await fs.rm(path.join(pkgDir, 'node_modules'), {
+    recursive: true,
+    force: true,
+  })
 
   const pkgJsonPath = path.join(pkgDir, 'package.json')
   const pkgData = require(pkgJsonPath)

packages/next-swc/crates/next-core/src/next_client/context.rs

@@ -212,9 +212,29 @@ pub async fn get_client_module_options_context(
         false,
         next_config,
     );
-    let webpack_rules =
-        *maybe_add_babel_loader(project_path, *next_config.webpack_rules().await?).await?;
-    let webpack_rules = maybe_add_sass_loader(next_config.sass_config(), webpack_rules).await?;
+
+    // A separate webpack rules will be applied to codes matching
+    // foreign_code_context_condition. This allows to import codes from
+    // node_modules that requires webpack loaders, which next-dev implicitly
+    // does by default.
+    let foreign_webpack_rules = maybe_add_sass_loader(
+        next_config.sass_config(),
+        *next_config.webpack_rules().await?,
+    )
+    .await?;
+    let foreign_webpack_loaders = foreign_webpack_rules.map(|rules| {
+        WebpackLoadersOptions {
+            rules,
+            loader_runner_package: Some(get_external_next_compiled_package_mapping(Vc::cell(
+                "loader-runner".to_owned(),
+            ))),
+        }
+        .cell()
+    });
+
+    // Now creates a webpack rules that applies to all codes.
+    let webpack_rules = *foreign_webpack_rules.clone();
+    let webpack_rules = *maybe_add_babel_loader(project_path, webpack_rules).await?;
     let enable_webpack_loaders = webpack_rules.map(|rules| {
         WebpackLoadersOptions {
             rules,
@@ -252,9 +272,14 @@ pub async fn get_client_module_options_context(
         preset_env_versions: Some(env),
         execution_context: Some(execution_context),
         custom_ecma_transform_plugins,
+        ..Default::default()
+    };
+
+    let foreign_codes_options_context = ModuleOptionsContext {
+        enable_webpack_loaders: foreign_webpack_loaders,
         // NOTE(WEB-1016) PostCSS transforms should also apply to foreign code.
         enable_postcss_transform: postcss_transform_options.clone(),
-        ..Default::default()
+        ..module_options_context.clone()
     };
 
     let module_options_context = ModuleOptionsContext {
@@ -270,7 +295,7 @@ pub async fn get_client_module_options_context(
         rules: vec![
             (
                 foreign_code_context_condition(next_config, project_path).await?,
-                module_options_context.clone().cell(),
+                foreign_codes_options_context.cell(),
             ),
             // If the module is an internal asset (i.e overlay, fallback) coming from the embedded
             // FS, don't apply user defined transforms.