新版本remix框架SSR报global.css错误
aofong opened this issue · comments
aofong commented
Version of antd-mobile
5.34.0
Operating system and its version
Others
Browser and its version
Microsoft Edge 123.0.2420.53 (正式版本) (x86_64)
Sandbox to reproduce
No response
What happened?
在新版本remix框架中antd-mobile
启动报错,新版本remix使用了vite来编译,之前的版本好像可以正常使用
remix:2.8.1
vite: 5.2.6
Relevant log output
09:34:50 [vite] Error when evaluating SSR module /app/routes/_index.tsx: failed to import "antd-mobile"
|- /Users/123/Documents/WorkDocument/td_h5_cloud/node_modules/antd-mobile/cjs/global/global.css:1
:root {
^
SyntaxError: Unexpected token ':'
at internalCompileFunction (node:internal/vm:73:18)
at wrapSafe (node:internal/modules/cjs/loader:1274:20)
at Module._compile (node:internal/modules/cjs/loader:1320:27)
at Module._extensions..js (node:internal/modules/cjs/loader:1414:10)
at Module.load (node:internal/modules/cjs/loader:1197:32)
at Module._load (node:internal/modules/cjs/loader:1013:12)
at Module.require (node:internal/modules/cjs/loader:1225:19)
at require (node:internal/modules/helpers:177:18)
at Object.<anonymous> (/Users/123/Documents/WorkDocument/td_h5_cloud/node_modules/antd-mobile/cjs/global/index.js:3:1)
at Module._compile (node:internal/modules/cjs/loader:1356:14)
typytypytypy commented
make sure you put ?url at the end of the import
import antdGlobalStyles from "antd-mobile/es/global/global.css?url";
aofong commented
typytypytypy commented
I'm not sure exactly what the error is for you, but I can show you what is working for me:
vite.config.ts
//added antd-mobile to ssr:noExternal
ssr: {
noExternal: ["antd-mobile"],
},
package.json
// pinned react to canary version
"react": "^18.3.0-canary-c3048aab4-20240326",
"react-dom": "^18.3.0-canary-c3048aab4-20240326",
root.tsx
import antdGlobalStyles from "antd-mobile/es/global/global.css?url";
import antdstyles from "antd-mobile/bundle/style.css?url";
...
export const links = () => {
return [
{ rel: "stylesheet", href: antdGlobalStyles },
{ rel: "stylesheet", href: antdstyles },
Try those changes and let me know what you get.
aofong commented
@typytypytypy Thank you very much