Notable Changes
Vue CLI UI CORS Issue
A critical CORS vulnerability is fixed in this version.
We recommend all users of vue ui
to upgrade to this version as soon as possible.
Lock Minor Version By Default
From this version on, newly-created projects and newly-added CLI plugins will lock the plugin version ranges to their minor versions.
The core functionalities of Vue CLI is quite stable at the moment. So we decided to make this change to improve project stability even more.
Users can run vue upgrade
periodically to bump the minor versions in the projects.
We also expect this change to make the adoption of new features smoother.
See more detailed explanation at #5012
ESLint 6
With the recent updates in the ecosystem (eslint-plugin-vue, @vue/eslint-config-airbnb, @vue/eslint-config-standard, @vue/eslint-config-prettier, @vue/eslint-config-typescript), Vue CLI now supports ESLint 6. It will scaffold all new projects will ESLint 6.
For users from older versions, ESLint 5 is still supported. If you want to adopt ESLint 6 in the project, it's recommended to migrate through the vue upgrade
command; otherwise, there will be much manual work to do.
Optional Chaining & Nullish Coalescing
We now support the optional chaining and nullish coalescing operators!
Note: scripts only, support in template expressions only available for Vue 3
// Optional chaining
a?.(); // undefined if `a` is null/undefined
b?.c; // undefined if `b` is null/undefined
// Nullish coalescing
undefined ?? 'some other default'; // result: 'some other default'
null ?? 'some other default'; // result: 'some other default'
'' ?? 'some other default'; // result: ''
0 ?? 300; // result: 0
false ?? true; // result: false
If you're using Babel, these syntaxes supported by default since this version, so no actions to take.
If you're using TypeScript, the vue upgrade
command will automatically do the necessary
configurations for you, or you can manually upgrade your typescript dependency to 3.7.0 or later.
vue upgrade
and vue migrate
See the Pull Request at #5091
You may have encountered the TypeError: Invalid Version: N/A
error if you ran vue upgrade
in a monorepo or forgot to run npm install
first.
It is because, to run corresponding migration scripts, Vue CLI needs to know which versions of plugins the project previously depended on.
Monorepo support has been added since v4.2.
But in case of missing dependencies or any other edge cases, you can pass a --from
option to the command to skip the local version detection step. For example: vue upgrade eslint --from 4.1.2
.
A vue migrate --from
command is available for those already bumped to the latest versions but didn't run the migration scripts.
Better Yarn 2 Support
Previously in v4.1.0, we added basic Yarn 2 support with the introduction of vue-cli-plugin-pnp
package.
Now since Yarn 2 has officially released, we have also improved the support in Vue CLI.
You can create new projects directly with Yarn 2 and run it. That extra plugin is no longer required.
Note
Not every plugin works under Yarn 2. Yarn 2 comes with a lot of breaking changes that make requires some serious work to be done in the entire Node.js ecosystem.
As for Vue CLI, we still have much work to do for the compatibility of thetypescript
,unit-*
, ande2e-*
plugins. There may also be a few glitches in theeslint
plugin.
yarn dlx -p @vue/cli vue create hello-yarn-2 --default
cd hello-yarn-2
yarn serve
Project Template Changes
- The default ESLint version is bumped to v6. Users can upgrade through
vue upgrade
. - The default TypeScript version is bumped from
~3.5.3
to~3.7.5
. Users can upgrade throughvue upgrade
, or manually change the dependency version inpackage.json
- For ESLint + TypeScript + Nightwatch users, due to the ESLint rule change, an additional rule needs to be added to
tests/e2e/.eslintrc
. We haven't implemented an automatic migration script for it. Please add it manually. See https://github.com/vuejs/vue-cli/blob/v4.2.0/packages/%40vue/cli-plugin-e2e-nightwatch/generator/template/tests/e2e/_eslintrc.js#L5 - The default
@vue/test-utils
version used for unit tests is bumped from1.0.0-beta.29
to1.0.0-beta.31
. Due to the breaking changes, we didn't migrate it automatically for old projects. Please read the release notes and upgrade at your own will.
Detailed Changelog
🚀 New Features
@vue/cli-plugin-babel
,@vue/cli-plugin-eslint
,@vue/cli-plugin-typescript
,@vue/cli
@vue/cli-plugin-unit-jest
,@vue/cli-plugin-unit-mocha
@vue/cli-ui
,@vue/cli
@vue/cli-plugin-typescript
,@vue/cli-ui
@vue/cli
@vue/cli-service
- #4953 feat: adds transparent PnP support to Webpack (@arcanis)
- #2411 feat(cli): add
--stdin
flag to serve (@nullpilot)
@vue/babel-preset-app
,@vue/cli-plugin-e2e-nightwatch
,@vue/cli-plugin-eslint
,@vue/cli-plugin-pwa
,@vue/cli-ui-addon-webpack
,@vue/cli-ui-addon-widgets
,@vue/cli-ui
,@vue/cli
@vue/cli-service
,@vue/cli-shared-utils
,@vue/cli
@vue/babel-preset-app
@vue/cli-service-global
🐛 Bug Fix
@vue/cli-shared-utils
,@vue/cli
@vue/cli
- #5062 fix
afterInvoke
/onCreateComplete
callbacks in Migrator (@sodatea) - #5038 fix:
extendPackage
dependency versions should be string (@pksunkara)
- #5062 fix
@vue/cli-ui
,@vue/cli
@vue/cli-plugin-e2e-cypress
- #5108 fix(e2e-cypress): make
--headless
work with--browser chrome
(@LinusBorg) - #4910 fix: comment eslint disable in cypress config (@cexbrayat)
- #5108 fix(e2e-cypress): make
@vue/cli-service
@vue/cli-plugin-pwa
@vue/cli-plugin-unit-jest
,@vue/cli-plugin-unit-mocha
@vue/cli-service
,@vue/cli-test-utils
@vue/cli-plugin-e2e-nightwatch
- #5016 fix(e2e-nightwatch): check for correct flag name (@LinusBorg)
📝 Documentation
- #5019 Updated zh-cn translation in cli section (@mactanxin)
🏠 Internal
@vue/babel-preset-app
,@vue/cli-plugin-babel
@vue/cli-service
@vue/cli
@vue/cli-shared-utils
@vue/cli-plugin-router
,@vue/cli-plugin-typescript
,@vue/cli-service
Committers: 17
- Alexander Sokolov (@Alex-Sokolov)
- Bogdan Luca (@lbogdan)
- Cédric Exbrayat (@cexbrayat)
- Dan Hogan (@danhogan)
- Daniel Bächtold (@danbaechtold)
- Eduardo San Martin Morote (@posva)
- Guillaume Chau (@Akryum)
- Haoqun Jiang (@sodatea)
- Marcel Lindig (@nullpilot)
- Maël Nison (@arcanis)
- Pavan Kumar Sunkara (@pksunkara)
- Tao Wei (@taoweicn)
- Thomas Kint (@tkint)
- Thorsten Lünborg (@LinusBorg)
- Xin Tan (@mactanxin)
- Yingya Zhang (@zyy7259)
- plantainX (@cheqianxiao)