Fix require statements with plain template literals (#7369)

packages/core/integration-tests/test/integration/commonjs-template-literal-interpolation/index.js

@@ -0,0 +1,7 @@
+const fn = 'add';
+
+module.exports = function (a, b) {
+  const add = require(`lodash/${fn}`);
+
+  return add(a, b);
+};

packages/core/integration-tests/test/integration/commonjs-template-literal-interpolation/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "commonjs-require",
+  "private": true,
+  "main": "dist/index.js",
+  "targets": {
+    "main": {
+      "context": "node"
+    }
+  },
+  "dependencies": {
+    "lodash": "*"
+  }
+}

packages/core/integration-tests/test/integration/commonjs-template-literal-plain/index.js

@@ -0,0 +1,5 @@
+const _ = require(`lodash`);
+
+module.exports = function (a, b) {
+  return _.add(a, b);
+};

packages/core/integration-tests/test/integration/commonjs-template-literal-plain/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "commonjs-require",
+  "private": true,
+  "main": "dist/index.js",
+  "targets": {
+    "main": {
+      "context": "node"
+    }
+  },
+  "dependencies": {
+    "lodash": "*"
+  }
+}

packages/core/integration-tests/test/javascript.js

@@ -4422,6 +4422,45 @@ describe('javascript', function () {
     assert.equal(await run(b), 2);
   });
 
+  it('should detect requires in commonjs with plain template literals', async function () {
+    let b = await bundle(
+      path.join(
+        __dirname,
+        '/integration/commonjs-template-literal-plain/index.js',
+      ),
+    );
+    let dist = await outputFS.readFile(
+      b.getBundles().find(b => b.type === 'js').filePath,
+      'utf8',
+    );
+    assert(dist.includes('$cPUKg$lodash = require("lodash");'));
+
+    let add = await run(b);
+    assert.equal(add(2, 3), 5);
+  });
+
+  it(`should detect requires in commonjs with plain template literals`, async function () {
+    let b = await bundle(
+      path.join(
+        __dirname,
+        '/integration/commonjs-template-literal-interpolation/index.js',
+      ),
+    );
+    let dist = await outputFS.readFile(
+      b.getBundles().find(b => b.type === 'js').filePath,
+      'utf8',
+    );
+
+    assert(
+      dist.includes(
+        'const add = require(`lodash/${$8cad8166811e0063$var$fn}`);',
+      ),
+    );
+
+    let add = await run(b);
+    assert.equal(add(2, 3), 5);
+  });
+
   it('only updates bundle names of changed bundles for browsers', async () => {
     let fixtureDir = path.join(__dirname, '/integration/name-invalidation');
     let _bundle = () =>

packages/transformers/js/core/src/dependency_collector.rs

@@ -539,6 +539,19 @@ impl<'a> Fold for DependencyCollector<'a> {
     }
 
     let node = if let Some(arg) = node.args.get(0) {
+      let mut arg = arg.clone();
+
+      // convert require(`./name`) to require("./name")
+      if let ast::Expr::Tpl(_tpl) = &*arg.expr {
+        if _tpl.quasis.len() == 1 && _tpl.exprs.is_empty() {
+          let tpl_str = &_tpl.quasis[0].raw;
+          arg.expr = Box::new(ast::Expr::Lit(ast::Lit::Str(ast::Str {
+            value: tpl_str.clone().value,
+            ..tpl_str.clone()
+          })));
+        }
+      }
+
       if kind == DependencyKind::ServiceWorker || kind == DependencyKind::Worklet {
         let (source_type, opts) = if kind == DependencyKind::ServiceWorker {
           match_worker_type(node.args.get(1))

packages/transformers/js/core/src/utils.rs

@@ -109,6 +109,12 @@ pub fn match_require(
               if let Expr::Lit(Lit::Str(str_)) = &*arg.expr {
                 return Some(str_.value.clone());
               }
+
+              if let ast::Expr::Tpl(_tpl) = &*arg.expr {
+                if _tpl.quasis.len() == 1 && _tpl.exprs.is_empty() {
+                  return Some(_tpl.quasis[0].raw.clone().value);
+                }
+              }
             }
           }
 
@@ -120,6 +126,12 @@ pub fn match_require(
               if let Expr::Lit(Lit::Str(str_)) = &*arg.expr {
                 return Some(str_.value.clone());
               }
+
+              if let ast::Expr::Tpl(_tpl) = &*arg.expr {
+                if _tpl.quasis.len() == 1 && _tpl.exprs.is_empty() {
+                  return Some(_tpl.quasis[0].raw.clone().value);
+                }
+              }
             }
           }