arco-design / arco-design-mobile

React mobile UI components library based on Arco Design
https://arco.design/mobile/react/arco-design/pc/#/
MIT License
381 stars 72 forks source link

Vite 按照文档步骤引入样式,报错 #18

Open Tenodec opened 2 years ago

Tenodec commented 2 years ago

引入代码 ` ....

import '@arco-design/mobile-react/esm/style'; ... `

报错: [plugin:vite:css] '~@arco-design/mobile-utils/style/mixin.less' wasn't found.

Tenodec commented 2 years ago

暂时用 import '@arco-design/mobile-react/dist/style.css';这样引入解决了

wonuanyangying commented 1 year ago

暂时用 import '@arco-design/mobile-react/dist/style.css';这样引入解决了

目前可以先参考这个解决方案:https://github.com/vitejs/vite/issues/2185

我们后续会尝试移除 *.less 中 ~ 前置符号或升级项目构建工具来兼容ESM编译构建工具

lzm0x219 commented 1 year ago

使用pnpm的情况下,依然会报错

bingqichen commented 1 year ago

pnpm 先使用 pnpm i --shamefully-hoist 安装吧,我感觉是pnpm的安装方式导致vite识别路径出现了问题,跟arco关系不大 @0x219

lzm0x219 commented 1 year ago

pnpm 先使用 pnpm i --shamefully-hoist 安装吧,我感觉是pnpm的安装方式导致vite识别路径出现了问题,跟arco关系不大 @0x219

是路径识别有问题,但是和arco也有关系呀,至少antd没报错。提升依赖的话 pnpm也就没意义了,按道理库本身要做这些兼容处理的呀。。。 如果说这个兼容的处理优先级比较低,那么也建议在文档中说明一下,以免大家提同样的问题

bingqichen commented 1 year ago

pnpm 先使用 pnpm i --shamefully-hoist 安装吧,我感觉是pnpm的安装方式导致vite识别路径出现了问题,跟arco关系不大 @0x219

是路径识别有问题,但是和arco也有关系呀,至少antd没报错。提升依赖的话 pnpm也就没意义了,按道理库本身要做这些兼容处理的呀。。。 如果说这个兼容的处理优先级比较低,那么也建议在文档中说明一下,以免大家提同样的问题

嗯,确实文档里应该要说一下比较好,用不同工具遇到的Q&A也是文档的一部分作用

TinaPeach commented 1 year ago

@0x219 收到,同学,我们调研一下兼容方案哈~

lzm0x219 commented 1 year ago

@0x219 收到,同学,我们调研一下兼容方案哈~

好的

leejunhui commented 1 year ago

@TinaPeach 你好,请问现在有可以落地的方案了吗

wonuanyangying commented 1 year ago

@0x219 收到,同学,我们调研一下兼容方案哈~

好的

同学 我这边用 pnpm 跑了一遍 vite 项目,按照上面的解决方案配置了 resolve.alias,并没有复现你的问题

wonuanyangying commented 1 year ago

@TinaPeach 你好,请问现在有可以落地的方案了吗

可以参考下这个解决方案:https://github.com/vitejs/vite/issues/2185

wou101771 commented 1 day ago

问题还是存在啊