React: The above dynamic import cannot be analyzed by Vite.
christopherpickering opened this issue · comments
sur.la.route commented
Describe the bug
I have a simple react component page index.tsx
(same error if I use `.jsx):
import { useState } from "react";
import type { IslandExport } from "slinkity";
export const island: IslandExport = {
when: "client:load",
};
export default function About() {
const [count, setCount] = useState(0);
return (
<div>
<p>You've had {count} glasses of water 💧</p>
<button onClick={() => setCount(count + 1)}>Add one</button>
</div>
);
}
When I access the route and then save the file I get a vite warning:
3:40:26 PM [vite] warning:
/project/src/index.tsx
50 | window.$RefreshReg$ = prevRefreshReg;
51 | window.$RefreshSig$ = prevRefreshSig;
52 | import(import.meta.url).then((currentExports) => {
| ^
53 | RefreshRuntime.registerExportsForReactRefresh("/project/src/index.tsx", currentExports);
54 | import.meta.hot.accept((nextExports) => {
The above dynamic import cannot be analyzed by Vite.
See https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations for supported dynamic import formats. If this is intended to be left as-is, you can use the /* @vite-ignore */ comment inside the import() call to suppress this warning.
Plugin: vite:import-analysis
File: /project/src/index.tsx
It still builds and shows my changes, but I'm not sure how to get rid of the warning.. Any ideas are appreciated :)
(please complete the following information):
- OS: [macos]
- Browser [safari]
- Version [16.5]
- "slinkity": "^1.0.0-canary.0",
- "@11ty/eleventy": "^2.0.0-canary.25",
- "@slinkity/react": "^1.0.1",
- "react": "^17.0.2",
- "react-dom": "^17.0.2",
Additional context
Enabled react:
eleventyConfig.addPlugin(slinkity.plugin, slinkity.defineConfig({
renderers: [react()],
}))