webdevnerdstuff
commented
1 year ago Some additional information. I was messing around with removing the use of rollup.config.js, and was trying something unrelated. Instead of the rollup config, I used vite to build instead of rollup, and I didn't get the error. Why it works via vite, but not rollup, I have no idea.
vite.config.ts
:
```js
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import * as path from 'path';
import typescript2 from 'rollup-plugin-typescript2';
import dts from "vite-plugin-dts";
export default defineConfig({
plugins: [
vue(),
dts({
insertTypesEntry: true,
}),
typescript2({
check: false,
include: ["src/plugin/**/*.vue"],
tsconfigOverride: {
compilerOptions: {
outDir: "dist",
sourceMap: true,
declaration: true,
declarationMap: true,
},
},
exclude: ["vite.config.ts"]
})
],
build: {
rollupOptions: {
input: {
main: path.resolve(__dirname, "src/index.ts")
},
external: ['vue'],
output: {
exports: "named",
globals: {
vue: 'Vue',
},
},
},
},
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'),
},
},
});
```
vite.config.ts
ezolenko
Troubleshooting
Does
tschave the same output? NoDoes your Rollup plugin order match this plugin's compatibility? Yes
Can you create a minimal example that reproduces this behavior? This is the project repository I'm having this issue with: https://github.com/webdevnerdstuff/vuetify-drilldown-table
What happens and why it is incorrect
When trying to bundle the code, I'm getting this error output. The code works as expected when running in development under vite (
pnpm playif you are checking out the repo). The error is almost identical to what is happening in this issue: https://github.com/ezolenko/rollup-plugin-typescript2/issues/325 Except in my case I'm using@vitejs/plugin-vuenot the depreciated packagerollup-plugin-vue. Perhaps it's the same issue? The other issue didn't really have a resolution, so I'm a bit stuck at the moment and don't know what to do. Any help is greatly appreciated at this point as my experience with ts/rollup is relatively new'ish, and I've been stuck trying to figure this out for over a week now.In the repo example I gave, you can see the code in the
VDrilldownTable.vuefile at line 190. I also tried doing the same thing a different way (pretty much does the same thing) at line 201. They both produce the same error.Environment
Versions
https://github.com/webdevnerdstuff/vuetify-drilldown-table/blob/main/rollup.config.js ```js import alias from '@rollup/plugin-alias'; import commonjs from '@rollup/plugin-commonjs'; import nodePolyfills from 'rollup-plugin-polyfill-node'; import pkg from './package.json'; import typescript from 'rollup-plugin-typescript2'; import vue from '@vitejs/plugin-vue'; import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'; import { nodeResolve } from '@rollup/plugin-node-resolve'; import json from '@rollup/plugin-json'; import { fileURLToPath, URL } from 'node:url'; import scss from 'rollup-plugin-scss'; import postcss from 'rollup-plugin-postcss'; import terser from '@rollup/plugin-terser'; const banner = `/** * @name ${pkg.name} * @version ${pkg.version} * @description ${pkg.description} * @author ${pkg.author} * @copyright Copyright ${new Date().getFullYear()}, WebDevNerdStuff * @homepage ${pkg.homepage} * @repository ${pkg.repository} * @license ${pkg.license} License */ `; export default { input: 'src/index.ts', output: [ { exports: 'named', file: `dist/${pkg.name}.js`, format: 'cjs', banner, }, { exports: 'named', file: `dist/${pkg.name}.es.js`, format: 'es', banner, }, ], external: [ ...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {}), ], plugins: [ json(), alias({ resolve: ['.js', '.jsx', '.ts', '.tsx'], entries: [ { find: '@', replacement: 'src', }, ] }), nodePolyfills(), nodeResolve({ alias: { '@': fileURLToPath(new URL('./src', import.meta.url)), }, browser: true, extensions: [ '.js', '.json', '.jsx', '.mjs', '.ts', '.tsx', '.vue', ], }), commonjs(), typescript(), vue({ defaultLang: { script: 'ts' }, template: { transformAssetUrls }, }), vuetify({ autoImport: false, styles: 'none', }), postcss({ modules: true, extract: true }), scss(), terser(), ], }; ```
:rollup.config.js
https://github.com/webdevnerdstuff/vuetify-drilldown-table/blob/main/tsconfig.json ```json5 { "compilerOptions": { "allowSyntheticDefaultImports": true, "baseUrl": ".", "declaration": true, "declarationDir": "./dist", "esModuleInterop": true, "importHelpers": true, "jsx": "preserve", "lib": [ "ESNext", "DOM" ], "module": "ESNext", "moduleResolution": "Node", "noImplicitAny": false, "noEmit": true, "outDir": "./dist", "paths": { "@/*": [ "./src/*" ] }, "resolveJsonModule": true, "rootDir": "src", "skipLibCheck": true, "strict": true, "target": "ESNext", "typeRoots": [ "./ts", "./node_modules/@types", "./node_modules/vuetify/types" ], "types": [ "node", "vuetify" ], "useDefineForClassFields": true }, "exclude": [ "playground", "src/App.vue", "src/main.ts", "src/components/**/*.ts", "src/components/**/*.vue", "src/playground/**/*.vue", "src/playground/**/*.ts", "src/stores/**/*.ts", "node_modules" ], "include": [ "auto-imports.d.ts", "src/**/*.ts", "src/**/*.vue" ], "references": [ { "path": "./tsconfig.node.json" } ] } ```
:tsconfig.json
https://github.com/webdevnerdstuff/vuetify-drilldown-table/blob/main/package.json ```json { "name": "vuetify-drilldown-table", "version": "0.0.0-alpha1", "description": "The vuetify-drilldown-table", "private": false, "main": "dist/vuetify-drilldown-table.js", "module": "dist/vuetify-drilldown-table.es.js", "types": "dist/types/index.d.ts", "scripts": { "dev": "vite", "watch": "pnpm dev", "play": "sh src/playground/configs/build.sh && NODE_ENV=playground vite", "bundle": "rollup -c --bundleConfigAsCjs", "build": "vue-tsc && vite build", "predeploy": "npm run build", "deploy": "gh-pages -d docs", "prepublishOnly": "npm run bundle", "lint": "eslint src/**/*.{ts,vue} --max-warnings 10", "prepare": "husky install" }, "lint-staged": { "src/**/*.{js,ts,vue}": [ "npm run lint" ] }, "author": "WebDevNerdStuff & Bunnies... lots and lots of bunnies!
:package.json
```text > vuetify-drilldown-table@0.0.0-alpha1 bundle /Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table > rollup -c --bundleConfigAsCjs src/index.ts → dist/vuetify-drilldown-table.js, dist/vuetify-drilldown-table.es.js... rpt2: built-in options overrides: { "noEmitHelpers": false, "importHelpers": true, "noResolve": false, "noEmit": false, "noEmitOnError": false, "inlineSourceMap": false, "outDir": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/node_modules/.cache/rollup-plugin-typescript2/placeholder", "moduleResolution": 2, "allowNonTsExtensions": true } rpt2: parsed tsconfig: { "options": { "target": 99, "module": 99, "moduleResolution": 2, "strict": false, "importHelpers": true, "esModuleInterop": true, "allowSyntheticDefaultImports": true, "declaration": true, "baseUrl": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table", "outDir": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/node_modules/.cache/rollup-plugin-typescript2/placeholder", "rootDir": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src", "lib": [ "lib.esnext.d.ts", "lib.dom.d.ts" ], "paths": { "@/*": [ "./src/*" ] }, "types": [ "node", "vuetify" ], "typeRoots": [ "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/node_modules/@types", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/node_modules/vuetify/types" ], "skipLibCheck": true, "useDefineForClassFields": true, "jsx": 1, "resolveJsonModule": true, "noEmit": false, "configFilePath": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/tsconfig.json", "pathsBasePath": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table", "noEmitHelpers": false, "noResolve": false, "noEmitOnError": false, "inlineSourceMap": false, "allowNonTsExtensions": true }, "fileNames": [ "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/index.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugin/index.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugin/composables/helpers.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugin/composables/levelColors.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugin/utils/props.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugins/index.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugins/theme.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugins/vuetify.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/plugins/webfontloader.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/types/types.d.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/types/vite-env.d.ts", "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/src/types/vue-shim.d.ts" ], "projectReferences": [ { "path": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/tsconfig.node.json", "originalPath": "./tsconfig.node.json" } ], "typeAcquisition": { "enable": false, "include": [], "exclude": [] }, "raw": { "compilerOptions": { "target": "ESNext", "module": "ESNext", "moduleResolution": "Node", "strict": false, "importHelpers": true, "esModuleInterop": true, "allowSyntheticDefaultImports": true, "declaration": true, "declarationDir": "./dist", "baseUrl": ".", "outDir": "./dist", "rootDir": "src", "lib": [ "ESNext", "DOM" ], "paths": { "@/*": [ "./src/*" ] }, "types": [ "node", "vuetify" ], "typeRoots": [ "./ts", "./node_modules/@types", "./node_modules/vuetify/types" ], "skipLibCheck": true, "useDefineForClassFields": true, "jsx": "preserve", "resolveJsonModule": true, "noEmit": true }, "exclude": [ "playground", "src/App.vue", "src/main.ts", "src/components/**/*.ts", "src/components/**/*.vue", "src/playground/**/*.ts", "src/stores/**/*.ts", "node_modules" ], "include": [ "src/**/*.ts", "src/**/*.vue" ], "references": [ { "path": "./tsconfig.node.json" } ], "compileOnSave": false }, "errors": [], "wildcardDirectories": { "/users/webdevnerdstuff/dev/sites/plugins/vuetify-drilldown-table/src": 1 }, "compileOnSave": false } rpt2: typescript version: 5.0.4 rpt2: tslib version: 2.5.0 rpt2: rollup version: 3.20.6 rpt2: rollup-plugin-typescript2 version: 0.34.1 rpt2: plugin options: { "check": true, "verbosity": 3, "clean": false, "cacheRoot": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table/node_modules/.cache/rollup-plugin-typescript2", "include": [ "*.ts+(|x)", "**/*.ts+(|x)" ], "exclude": [ "*.d.ts", "**/*.d.ts" ], "abortOnError": true, "rollupCommonJSResolveHack": false, "useTsconfigDeclarationDir": false, "tsconfigOverride": {}, "transformers": [], "tsconfigDefaults": {}, "objectHashIgnoreUnknownHack": false, "cwd": "/Users/webdevnerdstuff/Dev/Sites/plugins/vuetify-drilldown-table", "typescript": "version 5.0.4" } rpt2: rollup config: { "external": [ "vue", "vuetify" ], "input": "src/index.ts", "plugins": [ { "name": "commonjs--resolver" }, { "name": "json" }, { "name": "alias" }, { "name": "polyfill-node" }, { "name": "node-resolve", "version": "15.0.2", "resolveId": { "order": "post" } }, { "name": "commonjs", "version": "24.1.0" }, { "name": "rpt2" }, { "name": "vite:vue" }, { "name": "vuetify:styles", "enforce": "pre" }, { "name": "postcss" }, { "name": "scss" }, { "name": "terser", "numOfWorkersUsed": 0 }, { "name": "stdin" } ], "output": [ { "banner": "/**\n * @name vuetify-drilldown-table\n * @version 0.0.0-alpha1\n * @description The vuetify-drilldown-table\n * @author WebDevNerdStuff & Bunnies... lots and lots of bunnies!plugin output with verbosity 3
: