Jevon617 / unplugin-svg-component

generate a vue/react component through svg files, supporting svg file HMR, Tree-shaking, SSR and TS hint.
MIT License
58 stars 5 forks source link

code2.replace is not a function #9

Closed vanchKong closed 1 year ago

vanchKong commented 1 year ago

https://github.com/Jevon617/unplugin-svg-component/blob/b70a717d4ba9041ea44e8d424aa562be9178fea3/src/core/generator.ts#L133

这里的 code 变成promise对象了

async function compileVueTemplate(template: string, vueVerison: string): Promise<string> {
  const pkgInfo = await getPackageInfo('@vue/compiler-sfc')
  if (!pkgInfo || pkgInfo?.version[0] !== vueVerison.slice(-1))
    throw new Error(`Cannot find module \'@vue/compiler-sfc@${vueVerison.slice(-1)}.x.x\'. Please install it.`)

  const pkg = await importModule('@vue/compiler-sfc')
  const { compileTemplate } = pkg
  const { code } = compileTemplate({
    source: template,
    id: '__svg-component__',
    filename: 'virtual:svg-component.vue',
  })
  let codeString = await code
  return codeString.replace(/export/g, '')
}
Jevon617 commented 1 year ago

@vanchKong 你的@vue/compiler-sfc是什么版本? 如果能提供一个最小的复现demo就更好了.

vanchKong commented 1 year ago

@vanchKong 你的@vue/compiler-sfc是什么版本? 如果能提供一个最小的复现demo就更好了.

https://stackblitz.com/edit/vitejs-vite-gwuf8a?file=package.json,vite.config.js,src%2FApp.vue,src%2Fmain.js,build%2Fplugins.js&terminal=dev

我找到原因了,在 prettier 2.8.8版本中 .format() 方法返回了一个 string,在3.0.1中,返回的是 string的promise对象。 .format() 方法在 /@vue/compiler-sfc/dist/compiler-sfc.js中调用了。

compileVueTemplate(unplugin-svg-component) >>> compileTemplate(compiler-sfc) >>> actuallyCompile(compiler-sfc) >>> format(prettier)

上面的代码将 prettier 回退到 @2 就没问题了