[BUG] Vue SFC compilation breaking during SSR due to Vite internal `stripLiteral` function

[AaronBeaudoin]

Describe the bug

Suppose I have a simple App.vue file like this:

<script>
const getTestData = async () => {
  const filename = "message";
  console.log(await import(`./data/something/${filename}.json`));
  console.log(await import(`./data/whatever/${filename}.json`));
};

getTestData();
export default {};
</script>

<template>
  <div class="whatever">
    {{ new Date() }}
  </div>
</template>

As you can I see, I dynamically import two .json files, which I might do in the real world to get data. When I run my project, I get the following error:

/App.vue:8
  console.log(await __vite_ssr_import_0__.default((__vite_ssr_import_meta__.glob("./data/whatever/*.json")), `./data/whatever/${filename}.json`));
                                                                            ^

TypeError: __vite_ssr_import_meta__.glob is not a function
    at getTestData (/App.vue:8:77)

The error can be avoided by either:

1. Removing the class="whatever" attribute.
2. Removing one of the dynamic imports.

The reason for this is because the cause of the issue is the stripLiteral function used internally by Vite. For a more detailed explanation, please read the README of the minimal reproduction repository.

Reproduction

https://github.com/AaronBeaudoin/vite-ssr-issue-vue-sfc-dynamic-import

Steps to reproduce

Please see the minimal reproduction repository for reproduction steps and a detailed explanation.

System Info

System:
    OS: macOS 12.5
    CPU: (10) arm64 Apple M1 Pro
    Memory: 74.63 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.19.0 - ~/.volta/tools/image/node/16.19.0/bin/node
    npm: 8.19.3 - ~/.volta/tools/image/node/16.19.0/bin/npm
  Browsers:
    Chrome: 109.0.5414.119
    Safari: 15.6
  npmPackages:
    @vitejs/plugin-vue: ^4.0.0 => 4.0.0 
    vite: ^4.0.4 => 4.0.4

Used Package Manager

npm

Logs

Click to expand!

/App.vue:8
  console.log(await __vite_ssr_import_0__.default((__vite_ssr_import_meta__.glob("./data/whatever/*.json")), `./data/whatever/${filename}.json`));
                                                                            ^

TypeError: __vite_ssr_import_meta__.glob is not a function
    at getTestData (/App.vue:8:77)

Validations

• [X] Follow our Code of Conduct
• [X] Read the Contributing Guidelines.
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• [X] The provided reproduction is a minimal reproducible example of the bug.

[AaronBeaudoin]

A fix has been released for the strip-literal dependency including the relevant code. Is getting the fix in Vite as simple now as updating all the package.json files in the Vite repo that use the package?

[bluwy]

Yup, we usually have weekly dependency updates so the new version should be picked up soon.