feat: add ssrRequire in ssrloadmodule for #5424

packages/playground/ssr-vue/__tests__/ssr-vue.spec.ts

@@ -4,6 +4,15 @@ import fetch from 'node-fetch'
 
 const url = `http://localhost:${port}`
 
+test('require syntax can be used natural in server side', async () => {
+  await page.goto(url + '/require')
+  expect(await page.textContent('h1')).toMatch('foo')
+
+  // raw http request
+  const requireHtml = await (await fetch(url + '/require')).text()
+  expect(requireHtml).toMatch('foo')
+})
+
 test('vuex can be import succeed by named import', async () => {
   await page.goto(url + '/store')
   expect(await page.textContent('h1')).toMatch('bar')
@@ -13,7 +22,6 @@ test('vuex can be import succeed by named import', async () => {
   expect(storeHtml).toMatch('bar')
 })
 
-
 test('/about', async () => {
   await page.goto(url + '/about')
   expect(await page.textContent('h1')).toMatch('About')

packages/playground/ssr-vue/config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  foo: 'foo'
+}

packages/playground/ssr-vue/src/pages/Require.vue

@@ -0,0 +1,28 @@
+<template>
+  <h1>{{foo}}</h1>
+</template>
+
+<script>
+export default {
+  async setup() {
+    if (typeof window === 'undefined') {
+      // code execute in server side
+      const { resolve } = require('path')
+      const cwd = process.env.JEST_WORKER_ID !== undefined ? resolve(process.cwd(), './packages/playground/ssr-vue') : process.cwd()
+      const { foo } = require(resolve(cwd, './config'))
+      return {
+        foo: foo
+      }
+    }
+    return {
+      foo: 'foo'
+    }
+  }
+}
+</script>
+
+<style scoped>
+h1 {
+  color: red;
+}
+</style>

packages/vite/src/node/ssr/ssrModuleLoader.ts

@@ -139,6 +139,11 @@ async function instantiateModule(
     }
     return moduleGraph.urlToModuleMap.get(dep)?.ssrModule
   }
+  const ssrRequire = (dep: string) => {
+    return require(require.resolve(dep, {
+      paths: [path.dirname(mod.file!)]
+    }))
+  }
 
   const ssrDynamicImport = (dep: string) => {
     // #3087 dynamic import vars is ignored at rewrite import path,
@@ -168,6 +173,7 @@ async function instantiateModule(
     const AsyncFunction = async function () {}.constructor as typeof Function
     const initModule = new AsyncFunction(
       `global`,
+      `require`,
       ssrModuleExportsKey,
       ssrImportMetaKey,
       ssrImportKey,
@@ -177,6 +183,7 @@ async function instantiateModule(
     )
     await initModule(
       context.global,
+      ssrRequire,
       ssrModule,
       ssrImportMeta,
       ssrImport,