有没有老哥比较熟悉 vite 插件的,有偿请教

2023-05-11 15:35:15 +08:00
 mokevip

目前情况是,写了一个 vite 文件替换插件,可以将 home.tsx 替换成 home.params.tsx 的内容

但是现在出现一个问题,home.params.tsx 需要引入 home.tsx 的内容,但是 home.tsx 的内容已经被替换了,造成了循环引用

这个计算机入门题我当然会,将 home.tsx 文件找个地方存起来就好了。

但是问题出现了:

  1. 如何辨别什么时候是需要引入源文件、什么时候引入替换后的文件
  2. (接上条),在 vite 里我好像只能根据目录来,我在文件路径后面添加了 ?no-rewrite 标识,完成了所有的功能,但是 ts-check 不认,单行频闭报错下面的引入也会报错,不行就只能关掉整个 ts 检查
  3. 探索了其他方式,比如配置别名,但是在 vite load 的时候只会返回绝对路径,无从判断

纠结了几天了,站内有没有了解这块的大神,有偿请大家帮忙一下

base: bW9rZXZpcDg=

497 次点击
所在节点    问与答
4 条回复
muunala10221
2023-05-11 16:45:50 +08:00
这确实是一个有趣的问题。解决此类问题的关键是确保在需要的时候能正确地访问到源文件,同时防止循环引用。这里提供一种可能的解决方案:

源文件和替换文件的分离:你可以创建一个新的文件(例如,home.original.tsx ),在替换 home.tsx 前,先将原始的 home.tsx 内容拷贝到 home.original.tsx 中。然后,home.params.tsx 可以安全地引用 home.original.tsx ,而不会引发循环引用。

使用特定的标记:在需要引用原始文件的地方,你可以使用一种特殊的注释或标记。例如,你可以在 home.params.tsx 中使用如下的引用:

tsx
Copy code
// @original
import Home from './home.tsx';
然后,你的插件可以搜索这些标记,并在发现它们时替换为指向原始文件的引用:

tsx
Copy code
import Home from './home.original.tsx';
处理 TypeScript 错误:关于 TypeScript 的问题,你可以尝试在项目的 tsconfig.json 文件中使用 "paths" 选项来映射你的特殊标记到正确的文件。例如:

json
Copy code
{
"compilerOptions": {
"paths": {
"*?no-rewrite": ["*"]
}
}
}
这是一个复杂的问题,可能没有通用的解决方案。你可能需要根据项目的具体需求和限制来调整这个解决方案。希望这个建议能够对你有所帮助!





帮你问了 gpt4
mokevip
2023-05-11 19:30:37 +08:00
@muunala10221 "paths": {
"*?no-rewrite": ["*"]
} 我试过,不知道是因为什么,解析不到对应的文件,报错找不到该文件

源文件和替换文件的分离:你可以创建一个新的文件(例如,home.original.tsx )
想过这个方案,刚刚又试了一下 报错 Sourcemap for "..." points to missing source files

因为是新建的文件,sourcemap 中没有对应文件,无法加载。正在寻找解决方法
mokevip
2023-05-11 22:19:19 +08:00
@muunala10221 解决了,结合了两种想法,通过修改 @no-rewrite/index.tsx 变为 @/index.tsx?no-rewrite , 来避免引入报错问题,并标识需要源文件。 然后通过暂存,来存储源文件,在处理的地方 识别 ?no-rewrite 返回源文件


思路一一直很清晰,就是受限于各种写法限制,vite 传入的参数,ts 对引用路径的处理 等等

总结 chatgpt 还是有用的,虽然解决不了问题,但是能够提供思路
muunala10221
2023-05-12 08:39:10 +08:00
@mokevip 👍 比较主观的问题要一步步对话引导他

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/939226

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX