`ENOENT: no such file or directory, open '...?rollup-plugin-vue=script.d.ts'`

[gluons]

What happens and why it is wrong

Get this error when using with rollup-plugin-vue when set declaration to true in tsconfig.json.

Error: ENOENT: no such file or directory, open '<path to project directory>\dist\components\Hello.vue?rollup-plugin-vue=script.d.ts'

Repo to Repro: https://github.com/gluons/rollup-plugin-typescript2-issue-97

Environment

OS: Windows 10
Node: v10.4.1
Yarn: 1.7.0

Versions

• typescript: 2.8.4
• rollup: 0.62.0
• rollup-plugin-typescript2: 0.15.1

rollup.config.js

import { resolve } from 'path';

import ts from 'rollup-plugin-typescript2';
import vue from 'rollup-plugin-vue';

export default {
	input: resolve(__dirname, './src/index.ts'),
	output: [
		{
			file: resolve(__dirname, './dist/hello-plugin.umd.js'),
			format: 'umd',
			sourcemap: true,
			name: 'HelloPlugin',
			globals: {
				vue: 'Vue'
			}
		},
		{
			file: resolve(__dirname, './dist/hello-plugin.es.js'),
			format: 'es',
			sourcemap: true
		}
	],
	plugins: [
		ts({
			verbosity: 3 // Debug
		}),
		vue()
	],
	external: ['vue']
};

tsconfig.json

{
	"compilerOptions": {
		"module": "es2015",
		"moduleResolution": "node",
		"target": "es5",
		"lib": [
			"dom",
			"es2015"
		],
		"esModuleInterop": true,
		"sourceMap": true,
		"declaration": true
	},
	"include": [
		"src"
	]
}

package.json

{
  "name": "rolup-vue-ts-issue",
  "version": "0.0.0",
  "description": "A repo to repro Rollup + Vue + TypeScript with declaration bundling issue.",
  "private": true,
  "scripts": {
    "prebuild": "rimraf dist/*",
    "build": "rollup -c rollup.config.ts"
  },
  "author": "Saran Tanpituckpong <sarunta@gmail.com>",
  "license": "UNLICENSED",
  "devDependencies": {
    "@types/node": "8",
    "postcss": "^6.0.23",
    "rimraf": "^2.6.2",
    "rollup": "^0.62.0",
    "rollup-plugin-typescript2": "^0.15.1",
    "rollup-plugin-vue": "^4.3.0",
    "typescript": "~2.8",
    "vue-template-compiler": "^2.5.16"
  },
  "dependencies": {
    "vue": "^2.5.16"
  }
}

plugin output with verbosity 3

rpt2: typescript version: 2.8.4
rpt2: tslib version: 1.9.2
rpt2: rollup-plugin-typescript2 version: 0.15.1
rpt2: plugin options:
{
    "verbosity": 3,
    "check": true,
    "clean": false,
    "cacheRoot": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue/.rpt2_cache",
    "include": [
        "*.ts+(|x)",
        "**/*.ts+(|x)"
    ],
    "exclude": [
        "*.d.ts",
        "**/*.d.ts"
    ],
    "abortOnError": true,
    "rollupCommonJSResolveHack": false,
    "typescript": "version 2.8.4",
    "useTsconfigDeclarationDir": false,
    "tsconfigOverride": {},
    "transformers": [],
    "tsconfigDefaults": {}
}
rpt2: rollup config:
{
    "external": [
        "vue",
        "",
        ""
    ],
    "inlineDynamicImports": false,
    "input": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue\\src\\index.ts",
    "chunkGroupingSize": 5000,
    "perf": false,
    "plugins": [
        {
            "name": "rpt2"
        },
        {
            "name": "VuePlugin"
        }
    ],
    "entry": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue\\src\\index.ts"
}
rpt2: built-in options overrides: {
    "noEmitHelpers": false,
    "importHelpers": true,
    "noResolve": false,
    "noEmit": false,
    "inlineSourceMap": false,
    "outDir": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue/.rpt2_cache/placeholder",
    "moduleResolution": 2,
    "declarationDir": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue"
}
rpt2: parsed tsconfig: {
    "options": {
        "module": 5,
        "moduleResolution": 2,
        "target": 1,
        "lib": [
            "lib.dom.d.ts",
            "lib.es2015.d.ts"
        ],
        "esModuleInterop": true,
        "sourceMap": true,
        "declaration": true,
        "noEmitHelpers": false,
        "importHelpers": true,
        "noResolve": false,
        "noEmit": false,
        "inlineSourceMap": false,
        "outDir": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue/.rpt2_cache/placeholder",
        "declarationDir": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue",
        "configFilePath": "C:\\Users\\Saran\\my-projects\\rolup-vue-ts-issue/tsconfig.json"
    },
    "fileNames": [
        "C:/Users/Saran/my-projects/rolup-vue-ts-issue/src/index.ts",
        "C:/Users/Saran/my-projects/rolup-vue-ts-issue/src/sfc.d.ts"
    ],
    "typeAcquisition": {
        "enable": false,
        "include": [],
        "exclude": []
    },
    "raw": {
        "compilerOptions": {
            "module": "es2015",
            "moduleResolution": "node",
            "target": "es5",
            "lib": [
                "dom",
                "es2015"
            ],
            "esModuleInterop": true,
            "sourceMap": true,
            "declaration": true
        },
        "include": [
            "src"
        ]
    },
    "errors": [],
    "wildcardDirectories": {
        "C:/Users/Saran/my-projects/rolup-vue-ts-issue/src": 1
    },
    "compileOnSave": false,
    "configFileSpecs": {
        "includeSpecs": [
            "src"
        ],
        "validatedIncludeSpecs": [
            "src"
        ],
        "wildcardDirectories": {
            "C:/Users/Saran/my-projects/rolup-vue-ts-issue/src": 1
        }
    }
}
rpt2: included:
'[
    "*.ts+(|x)",
    "**/*.ts+(|x)"
]'
rpt2: excluded:
'[
    "*.d.ts",
    "**/*.d.ts"
]'
rpt2: Ambient types:
rpt2:     C:/Users/Saran/my-projects/rolup-vue-ts-issue/src/sfc.d.ts
rpt2:     C:/Users/Saran/my-projects/rolup-vue-ts-issue/node_modules/@types/estree/index.d.ts
rpt2:     C:/Users/Saran/my-projects/rolup-vue-ts-issue/node_modules/@types/node/index.d.ts
rpt2: ambient types changed, redoing all semantic diagnostics
rpt2: transpiling 'C:\Users\Saran\my-projects\rolup-vue-ts-issue\src\index.ts'
rpt2:     cache: 'C:\Users\Saran\my-projects\rolup-vue-ts-issue/.rpt2_cache/022f423b186edc509d0bfc04874ea603a25c1eb2/code/cache/9d9555d93b34027372939bd4a0a4dc41c41e13ac'
rpt2:     cache miss
rpt2:     cache: 'C:\Users\Saran\my-projects\rolup-vue-ts-issue/.rpt2_cache/022f423b186edc509d0bfc04874ea603a25c1eb2/syntacticDiagnostics/cache/9d9555d93b34027372939bd4a0a4dc41c41e13ac'
rpt2:     cache miss
rpt2:     cache: 'C:\Users\Saran\my-projects\rolup-vue-ts-issue/.rpt2_cache/022f423b186edc509d0bfc04874ea603a25c1eb2/semanticDiagnostics/cache/9d9555d93b34027372939bd4a0a4dc41c41e13ac'
rpt2:     cache miss
rpt2: generated declarations for 'C:/Users/Saran/my-projects/rolup-vue-ts-issue/src/index.ts'
rpt2: transpiling 'C:\Users\Saran\my-projects\rolup-vue-ts-issue\src\components\Hello.vue?rollup-plugin-vue=script.ts'
rpt2:     cache: 'C:\Users\Saran\my-projects\rolup-vue-ts-issue/.rpt2_cache/022f423b186edc509d0bfc04874ea603a25c1eb2/code/cache/53ea992621b40f9ced3a2ea5f2f0b86e2cb028b1'
rpt2:     cache miss
rpt2:     cache: 'C:\Users\Saran\my-projects\rolup-vue-ts-issue/.rpt2_cache/022f423b186edc509d0bfc04874ea603a25c1eb2/syntacticDiagnostics/cache/53ea992621b40f9ced3a2ea5f2f0b86e2cb028b1'
rpt2:     cache miss
rpt2:     cache: 'C:\Users\Saran\my-projects\rolup-vue-ts-issue/.rpt2_cache/022f423b186edc509d0bfc04874ea603a25c1eb2/semanticDiagnostics/cache/53ea992621b40f9ced3a2ea5f2f0b86e2cb028b1'
rpt2:     cache miss
rpt2: generated declarations for 'C:/Users/Saran/my-projects/rolup-vue-ts-issue/src/components/Hello.vue?rollup-plugin-vue=script.ts'
rpt2: generating target 1
rpt2: rolling caches
rpt2: writing declarations for 'C:/Users/Saran/my-projects/rolup-vue-ts-issue/src/index.ts' to 'C:\Users\Saran\my-projects\rolup-vue-ts-issue\dist\index.d.ts'
rpt2: writing declarations for 'C:/Users/Saran/my-projects/rolup-vue-ts-issue/src/components/Hello.vue?rollup-plugin-vue=script.ts' to 'C:\Users\Saran\my-projects\rolup-vue-ts-issue\dist\components\Hello.vue?rollup-plugin-vue=script.d.ts'

[ezolenko]

Should be fixed in master now -- I'm ignoring declarations for vue modules for now. Another option is to cut out everything after ? and write out *.vue.d.ts I guess.

[gluons]

OK. Thank you. 🙇‍♀
ENOENT error is gone now.

I'm not sure whether declaration from Vue file is important or not.
Maybe @znck can give an opinion?
Or any Vue + TypeScript developer who see this issue?

[wenbei]

I get this too with declaration set to true. I'm not using the vue plugin though. I think this is because my file path contains a space, judging by your previous fix.

[ezolenko]

@Hollyleaves could you post details or open a separate case? Space should be a valid character.

[znck]

Declaration files are important.
@ezolenko @gluons Could you tell me what is preventing generation of declaration files?

[gluons]

@znck

@ezolenko has fixed this issue temporarily in f0e466c and declaration of Vue file will be ignored.
It isn't writed out in dist directory for now.

[ezolenko]

@znck should declaration for Hello.vue be named Hello.vue.d.ts? Will all the tools pick it up properly at that?

I can't write them out as Hello.vue?rollup-plugin-vue=script.d.ts because ? is an invalid char for windows file paths.

[znck]

Part after ? is for referencing a block in vue file, you should remove it. I'm not sure if declaration file should be named Hello.d.ts or Hello.vue.d.ts. (@ktsn WDYT?)

[ktsn]

Maybe Hello.vue.d.ts?
I'm not sure how the final d.ts output looks like but as the most of TS users write the import statements for SFC with the extension (.vue), the declaration file may also need .vue.