https://codesandbox.io/p/sandbox/5rb54
codesandbox 在线,能够正常编译,跑起来。但是,当我把代码下载到本地, yarn start
后,却出错。这是为什么呢?这个 Demo.tsx 文件,就在那里啊......
另,我自己 clone 了一个 https://codesandbox.io/p/sandbox/mui-v4-treeview-react-dnd-forked-g3t6v3
也是这样,在线可以跑,下载代码到本地,就会出错,和上面的错误一样.
我在 macOS 和 windows 两套系统下,都试过了,报错一样
Compiled with problems:
×
ERROR
Cannot find module './Demo'
at webpackMissingModule ( http://localhost:3000/static/js/bundle.js:15:50)
at ./src/index.tsx ( http://localhost:3000/static/js/bundle.js:15:131)
at options.factory ( http://localhost:3000/static/js/bundle.js:40763:31)
at __webpack_require__ ( http://localhost:3000/static/js/bundle.js:40208:33)
at http://localhost:3000/static/js/bundle.js:41340:37
at http://localhost:3000/static/js/bundle.js:41342:12
1
whj768702 2023-12-07 15:28:19 +08:00
index.tsx 文件中的引入加上文件类型吧。
import Demo from "./Demo.tsx"; |
2
AJian 2023-12-07 15:46:35 +08:00
看了下这个仓库用的是`react-scripts`,看`react-scripts`源代码得知,当工程根目录没有`tsconfig.json`文件时,webpack 的`resolve.extensions`中的含`ts`的后缀会被移除,所以不能自动补全 tsx 后缀。
可以在 src/index.tsx 中的第 3 行"./Demo"加上.tsx 后缀,改成"./Demo.tsx"应该就可以正常了,或者加上`tsconfig.json`文件,并安装好相关的 types 包 |