Skip to content

error TS2305: Module 'vue' has no exported member 'mergeDefaults' #440

Closed
@zhong1998

Description

@zhong1998

Troubleshooting

  1. Does tsc have the same output? If so, please explain why this is incorrect behavior

  2. Does your Rollup plugin order match this plugin's compatibility? If not, please elaborate

  3. Can you create a minimal example that reproduces this behavior? Preferably, use this environment for your reproduction

What happens and why it is incorrect

I use export default definecomponent can be ok but use setup lang="ts" is false. it seems the plugin is wrong in run time.

Environment

<template>
  <img :src="src" class="component" :style="styleProps" @click.prevent="handleClick">
</template>

<script lang="ts" setup>
import {defineProps, withDefaults} from "vue"
import useComponentCommon from "./../../hook/useComponentCommon"
import {imageDefaultProps, imageStylePropsNames} from "../../defaultProps"

interface imgProps {
  src: string;
  actionType: string;
  url: string;
  // size
  height: string;
  width: string;
  paddingLeft: string;
  paddingRight: string;
  paddingTop: string;
  paddingBottom: string;
  // border type
  borderStyle: string;
  borderColor: string;
  borderWidth: string;
  borderRadius: string;
  // shadow and opacity
  boxShadow: string;
  opacity: string;
  // position and x,y
  position: string;
  left: string;
  top: string;
  right: string;
}

const props = withDefaults(defineProps<imgProps>(), {
  ...imageDefaultProps
})
const {styleProps, handleClick} = useComponentCommon(props, imageStylePropsNames)
</script>

<style scoped>
.component {
  max-width: 100%;
  position: relative !important;
}
</style>

Versions

"rollup-plugin-typescript2": "^0.34.1",


rollup.config.js

:
import fs from "fs"
import vue from "rollup-plugin-vue"
import css from "rollup-plugin-css-only"
import typescript from "rollup-plugin-typescript2";

const {name} = JSON.parse(fs.readFileSync("package.json", "utf-8"))
const file = type => `dist/${name}.${type}.js`

const overrides = {
    compilerOptions: {declaration: true},
}
export default {
    input: "src/index.ts",
    output: {
        name,
        file: file("esm"),
        format: 'es'
    },
    plugins: [
        typescript({tsconfigOverride:overrides}),
        vue(),
        css({output: "bundle.css"})
    ]
}

tsconfig.json

:
{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "moduleResolution": "node",
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "useDefineForClassFields": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env",
      "jest"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}

package.json

:
{
  "name": "xxxx",
  "version": "xxxx",
  "private": true,
  "type": "module",
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "test:unit": "vue-cli-service test:unit",
    "lint": "vue-cli-service lint",
    "build:esm": "rollup --config build/rollup.config.js"
  },
  "dependencies": {
    "core-js": "^3.8.3",
    "lodash-es": "^4.17.21",
    "vue": "^3.2.13"
  },
  "devDependencies": {
    "@types/jest": "^27.0.1",
    "@types/lodash-es": "^4.17.6",
    "@typescript-eslint/eslint-plugin": "^5.4.0",
    "@typescript-eslint/parser": "^5.4.0",
    "@vue/cli-plugin-babel": "~5.0.0",
    "@vue/cli-plugin-eslint": "~5.0.0",
    "@vue/cli-plugin-typescript": "~5.0.0",
    "@vue/cli-plugin-unit-jest": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "@vue/eslint-config-typescript": "^9.1.0",
    "@vue/test-utils": "^2.0.0-0",
    "@vue/vue3-jest": "^27.0.0-alpha.1",
    "babel-jest": "^27.0.6",
    "eslint": "^7.32.0",
    "eslint-plugin-vue": "^8.0.3",
    "jest": "^27.0.5",
    "rollup-plugin-css-only": "^4.3.0",
    "rollup-plugin-typescript2": "^0.34.1",
    "rollup-plugin-vue": "^6.0.0",
    "ts-jest": "^27.0.4",
    "tslib": "^1.14.1",
    "typescript": "~4.5.5"
  }
}

plugin output with verbosity 3

:

Metadata

Metadata

Assignees

No one assigned

    Labels

    kind: supportAsking for support with something or a specific use caseproblem: no reproNo reproduction was provided (and have not tried to repro without one)scope: integrationRelated to an integration, not necessarily to core (but could influence core)scope: vueRelated to integration with Vue (rollup-plugin-vue is long archived), not coresolution: Vue behaviorThis is Vue's behavior as well, so this is not a bug with this pluginsolution: duplicateThis issue or pull request already existssolution: out-of-scopeThis is out of scope for this project

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions