I wanna try to rollup a vue ponent library. But I got the error on my type checking. I try to update typescript as here has been mentioned but it didn't work. here is my code and package.json My ponent code which has been exported as a Button

 <template>
  button
    >{{ children }}</button>
</template>

<script lang="tsx">

declare type IconMode =
  | {
      iconMode?: "without-icon";
    }
  | {
      iconMode: "with-icon" | "icon-only";
      iconName: string;
    };
 ...
 </script>

and rollup.config.js is:

import monjs from "@rollup/plugin-monjs"; 
import vue from "rollup-plugin-vue"; 
import buble from "@rollup/plugin-buble"; 
import typescript from "@rollup/plugin-typescript";


export default {
  input: "src/index.ts",
  output: {
    name: "Button",
    exports: "named"
  },
  plugins: [
    typescript(),
    vue({
      css: true, 
      pileTemplate: true 
    }),
    monjs()
  ]
};

But I got this error on the terminal:

[!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)
src/Components/Button.vue?vue&type=script&lang.tsx (18:8)

18  declare type IconMode =
            ^ 
Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)

I'll be thankful if you could help me.

I wanna try to rollup a vue ponent library. But I got the error on my type checking. I try to update typescript as here has been mentioned but it didn't work. here is my code and package.json My ponent code which has been exported as a Button

 <template>
  button
    >{{ children }}</button>
</template>

<script lang="tsx">

declare type IconMode =
  | {
      iconMode?: "without-icon";
    }
  | {
      iconMode: "with-icon" | "icon-only";
      iconName: string;
    };
 ...
 </script>

and rollup.config.js is:

import monjs from "@rollup/plugin-monjs"; 
import vue from "rollup-plugin-vue"; 
import buble from "@rollup/plugin-buble"; 
import typescript from "@rollup/plugin-typescript";


export default {
  input: "src/index.ts",
  output: {
    name: "Button",
    exports: "named"
  },
  plugins: [
    typescript(),
    vue({
      css: true, 
      pileTemplate: true 
    }),
    monjs()
  ]
};

But I got this error on the terminal:

[!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)
src/Components/Button.vue?vue&type=script&lang.tsx (18:8)

18  declare type IconMode =
            ^ 
Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)

I'll be thankful if you could help me.

• javascript
• vue.js
• rollup

• Please provide the plete error log. – Hemand S Commented Sep 2, 2021 at 6:07

1 Answer 1

the problem is with the @rollup/plugin-typescript uninstall @rollup/plugin-typescript and install rollup-plugin-typescript2 instead.