使用 rollup打包 vue3.3 sfc( 导入文件中的类型)报错？

Question

<script lang="ts" setup>
import { Props } from './type'
// type Props = {
//   height: number
//   stepHeight: number
//   stepWaitTimeout: number
// }

// 导入其他文件的type，打包就会报错，而如何直接在这个sfc订阅type 打包就不会报错
import { useXXX } from './useXXX'
defineOptions({ name: 'SeamlessScroll' })
const props = withDefaults(defineProps<Partial<Props>>(), {
  height: 500,
})
const { style } = useXXX(props)
</script>
<template>
  <div class="wrap">
    <div
      :style="style"
    >
      TEST
    </div>
  </div>
</template>

// rollup.config.js
// 处理vue文件插件
import vue from 'rollup-plugin-vue' //版本 6.0.0
// 处理ts插件
import typescript from 'rollup-plugin-typescript2' //版本 0.34.1

export default {
  input: 'index.ts',
  output: [
    {
      name: 'test',
      file: 'test.esm.js',
      format: 'esm',
    },
  ],
  plugins: [typescript(), vue()],
  external: ['vue'], // 规定哪些是外部引用的模块
}

Answer 1

import vue from 'rollup-plugin-vue' //版本 6.0.0
import typescript from 'rollup-plugin-typescript2' //版本 0.34.1

import { Props } from './type' // 添加类型定义文件的导入

export default {
  input: 'index.ts',
  output: [
    {
      name: 'test',
      file: 'test.esm.js',
      format: 'esm',
    },
  ],
  plugins: [typescript(), vue()],
  external: ['vue'], 
}