Closed
Description
Version
4.5.3
Reproduction link
https://github.com/maikelvl/vue-cli-init-typescript-class-component
Environment info
System:
OS: Linux 4.14 Alpine Linux
CPU: (4) x64 Intel(R) Core(TM) i5-7600K CPU @ 3.80GHz
Binaries:
Node: 14.8.0 - /usr/local/bin/node
Yarn: 1.22.4 - /usr/local/bin/yarn
npm: 6.14.7 - /usr/local/bin/npm
Browsers:
Chrome: Not Found
Firefox: Not Found
npmPackages:
@ant-design-vue/babel-helper-vue-transform-on: 1.0.1
@vue/babel-helper-vue-jsx-merge-props: 1.0.0
@vue/babel-plugin-transform-vue-jsx: 1.1.2
@vue/babel-preset-app: 4.5.3
@vue/babel-preset-jsx: 1.1.2
@vue/babel-sugar-functional-vue: 1.1.2
@vue/babel-sugar-inject-h: 1.1.2
@vue/babel-sugar-v-model: 1.1.2
@vue/babel-sugar-v-on: 1.1.2
@vue/cli-overlay: 4.5.3
@vue/cli-plugin-babel: ~4.5.0 => 4.5.3
@vue/cli-plugin-e2e-cypress: ~4.5.0 => 4.5.3
@vue/cli-plugin-eslint: ~4.5.0 => 4.5.3
@vue/cli-plugin-pwa: ~4.5.0 => 4.5.3
@vue/cli-plugin-router: ~4.5.0 => 4.5.3
@vue/cli-plugin-typescript: ~4.5.0 => 4.5.3
@vue/cli-plugin-unit-jest: ~4.5.0 => 4.5.3
@vue/cli-plugin-vuex: ~4.5.0 => 4.5.3
@vue/cli-service: ~4.5.0 => 4.5.3
@vue/cli-shared-utils: 4.5.3
@vue/compiler-core: 3.0.0-rc.5
@vue/compiler-dom: 3.0.0-rc.5
@vue/compiler-sfc: ^3.0.0-0 => 3.0.0-rc.5
@vue/compiler-ssr: 3.0.0-rc.5
@vue/component-compiler-utils: 3.2.0
@vue/eslint-config-prettier: ^6.0.0 => 6.0.0
@vue/eslint-config-typescript: ^5.0.2 => 5.0.2
@vue/preload-webpack-plugin: 1.1.2
@vue/reactivity: 3.0.0-rc.5
@vue/runtime-core: 3.0.0-rc.5
@vue/runtime-dom: 3.0.0-rc.5
@vue/shared: 3.0.0-rc.5
@vue/test-utils: ^2.0.0-0 => 2.0.0-beta.2
@vue/web-component-wrapper: 1.2.0
eslint-plugin-vue: ^7.0.0-0 => 7.0.0-beta.2
jest-serializer-vue: 2.0.2
typescript: ~3.9.3 => 3.9.7
vue: ^3.0.0-0 => 3.0.0-rc.5
vue-class-component: ^8.0.0-0 => 8.0.0-alpha.6
vue-eslint-parser: 7.1.0
vue-hot-reload-api: 2.3.4
vue-jest: ^5.0.0-0 => 5.0.0-alpha.3 (3.0.6)
vue-loader: 15.9.3 (16.0.0-beta.5)
vue-router: ^4.0.0-0 => 4.0.0-beta.6
vue-style-loader: 4.1.2
vue-template-es2015-compiler: 1.9.1
vuex: ^4.0.0-0 => 4.0.0-beta.4
npmGlobalPackages:
@vue/cli: Not Found
Steps to reproduce
Generate project using @vue/cli@4.5.3 on Node v14.8.0:
$ vue init hello-world
Vue CLI v4.5.3
? Please pick a preset: Manually select features
? Check the features needed for your project: Choose Vue version, Babel, TS, PWA, Router, Vuex, CSS Pre-processors, Linter, Unit, E2E
? Choose a version of Vue.js that you wan... 3.x (Preview)
? Use class-style component syntax? Yes
? Use Babel alongside TypeScript (required... Yes
? Use history mode for router? (Requires p... Yes
? Pick a CSS pre-processor (PostCSS, Autop... Sass/SCSS (with node-sass)
? Pick a linter / formatter config: Prettier
? Pick additional lint features: Lint on save
? Pick a unit testing solution: Jest
? Pick an E2E testing solution: Cypress
? Where do you prefer placing config for B... In dedicated config files
? Save this as a preset for future projects? Yes
? Save preset as: typescript-class-component
? Pick the package manager to use when ins... YarnVue CLI preset
{
"useTaobaoRegistry": false,
"packageManager": "yarn",
"presets": {
"typescript-class-component": {
"useConfigFiles": true,
"plugins": {
"@vue/cli-plugin-babel": {},
"@vue/cli-plugin-typescript": {
"classComponent": true,
"useTsWithBabel": true
},
"@vue/cli-plugin-pwa": {},
"@vue/cli-plugin-router": {
"historyMode": true
},
"@vue/cli-plugin-vuex": {},
"@vue/cli-plugin-eslint": {
"config": "prettier",
"lintOn": [
"save"
]
},
"@vue/cli-plugin-unit-jest": {},
"@vue/cli-plugin-e2e-cypress": {}
},
"vueVersion": "3",
"cssPreprocessor": "node-sass"
}
}
}What is expected?
$ yarn serve
DONE Compiled successfully in 3812ms 2:22:25 PM
App running at:
- Local: http://localhost:8080/
It seems you are running Vue CLI inside a container.
Access the dev server via http://localhost:<your container's external mapped port>/
Note that the development build is not optimized.
To create a production build, run yarn build.What is actually happening?
$ yarn serve
DONE Compiled successfully in 3812ms 2:22:25 PM
App running at:
- Local: http://localhost:8080/
It seems you are running Vue CLI inside a container.
Access the dev server via http://localhost:<your container's external mapped port>/
Note that the development build is not optimized.
To create a production build, run yarn build.
ERROR in src/router/index.ts:8:5
TS2322: Type 'typeof Home' is not assignable to type 'undefined'.
6 | path: "/",
7 | name: "Home",
> 8 | component: Home
| ^^^^^^^^^
9 | },
10 | {
11 | path: "/about",Not sure if this is pure vue-cli issue, because there are a lot of alpha/beta/rc Vue dependencies.
Disabling class-style components does not have this effect.
Metadata
Metadata
Assignees
Labels
No labels