Vue SFC compilation breaking during SSR in Vite due to `strip-literal`
AaronBeaudoin opened this issue · comments
AaronBeaudoin commented
Describe the bug
Suppose I have a Vite SSR project with 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:
- Removing the
class="whatever"
attribute. - 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
System Info
System:
OS: macOS 12.5
CPU: (10) arm64 Apple M1 Pro
Memory: 146.80 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
Used Package Manager
npm
Validations
- Follow our Code of Conduct
- Read the Contributing Guide.
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
- The provided reproduction is a minimal reproducible of the bug.