Unable to build typeface-module

delaneyj commented 4 years ago

Describe the bug

Related to #392. vite works now with import 'typeface-inter', however vite build is failing to resolve the path, it looks to be related to module paths with spaces in them.

Reproduction

Within an App.vue

<script lang="ts">
import 'typeface-inter'
</script>

vite build

System Info

required vite version: 1.0.0-beta.6
required Operating System: PopOS 20.04
required Node version: v14.4.0
Optional:
- Installed vue version (from yarn.lock or package-lock.json) 3.0.0-beta.15
- Installed @vue/compiler-sfc version 3.0.0-beta.15

Logs (Optional if provided reproduction)

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

delaney@dev ~/frontend (delaney/webpack)$ npx vite build --debug
vite v1.0.0-beta.6
  vite:config env mode: production +0ms
  vite:config env: {} +1ms
  vite:config config resolved in 46ms +0ms
Building for production...
  vite:build:resolve /favicon.svg --> /home/delaney/frontend/public/favicon.svg +0ms
  vite:build:resolve /src/main.ts --> /home/delaney/frontend/src/main.ts +0ms
  vite:build:asset /home/delaney/frontend/public/favicon.svg -> /favicon.svg +0ms
[vite] Build errored out.
[Error: ENOENT: no such file or directory, open '/home/delaney/frontend/node_modules/typeface-inter/Inter (web'] {
  errno: -2,
  code: 'PLUGIN_ERROR',
  syscall: 'open',
  path: '/home/delaney/frontend/node_modules/typeface-inter/Inter (web',
  pluginCode: 'ENOENT',
  plugin: 'vite:css',
  hook: 'transform',
  id: '/home/delaney/frontend/node_modules/typeface-inter/inter.css',
  watchFiles: [
    ...
  ]
}

underfin commented 4 years ago

It caused by the regex incorrect match the url which has '()' character.

https://github.com/vitejs/vite/blob/50537c438dd66b414434b900a7901ff6e97320f9/src/node/utils/cssUtils.ts#L13

Look like it is hard with use regex to analysis url import. Maybe we should use a postcss plugin to do it, but it will add the cost of performance.

yyx990803 commented 4 years ago

That's the regex postcss-url is using though...

yyx990803 commented 4 years ago

The cause is because the url contains parens ())...

vitejs / vite