Skip to content

depAssetPlugin resolveFrom cause Dep optimization failed with error #1443

Closed
@awaw00

Description

⚠️ IMPORTANT ⚠️ Please check the following list before proceeding. If you ignore this issue template, your issue will be directly closed.

  • Read the docs.
  • Use Vite >=2.0. (1.x is no longer supported)
  • If the issue is related to 1.x -> 2.0 upgrade, read the Migration Guide first.

Describe the bug

hi,我发现使用vite构建带有antd这样自带样式的包的时候发现pre-building的时候会报错,错误大概是这样:

Dep optimization failed with error:
node_modules/vite/dist/node/chunks/dep-85227760.js:53802
(node:9234) UnhandledPromiseRejectionWarning: Error: Cannot find module '/Users/nifan/Projects/playground/react-simple-demo' from 'antd/dist/antd.css'

Reproduction

我尝试在项目中mock一个包,模拟类似的case,比如这样的一个zero,在入口文件中import一个antd.css:
image

然后在代码中import这个包:

import 'zero';
...

可以复现此问题。

自己尝试定位了一下应该是 https://github.com/vitejs/vite/blob/main/packages/vite/src/node/optimizer/depAssetPlugin.ts#L52 这里resolveFrom(config.root, importee)入参的顺序反了,调换后可以正常通过预构建。

但是这个时候构建出来的node_modules/.vite/zero.xxx.js文件中,import语句多了一大串相对路径前缀导致zero.js文件请求失败:

import '../../../../../../@fs/Users/nifan/Projects/playground/react-simple-demo/node_modules/antd/dist/antd.css';

手动移除前缀后可恢复正常:

import '/@fs/Users/nifan/Projects/playground/react-simple-demo/node_modules/antd/dist/antd.css';

排查了很久没有定位到这个相对路径是在哪里加上的,只能过来求助大家了~

System Info

  • vite version: vite/2.0.0-beta.12
  • Operating System: MacOS
  • Node version: node-v14.15.4
  • Package manager (npm/yarn/pnpm) and version: npm 6.14.10

Logs (Optional if provided reproduction)

  1. Run vite or vite build with the --debug flag.
  2. Provide the error log here.

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions