Skip to content

@sodatea sodatea released this Feb 7, 2020 · 23 commits to master since this release

How to Upgrade

First, reinstall the latest version of @vue/cli globally.

yarn global add @vue/cli
# OR
npm install -g @vue/cli

Then in the projects, run

vue upgrade

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.

#4985 #5142

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 the typescript, unit-*, and e2e-* plugins. There may also be a few glitches in the eslint plugin.

yarn dlx -p @vue/cli vue create hello-yarn-2 --default
cd hello-yarn-2
yarn serve

Project Template Changes

  1. The default ESLint version is bumped to v6. Users can upgrade through vue upgrade.
  2. The default TypeScript version is bumped from ~3.5.3 to ~3.7.5. Users can upgrade through vue upgrade, or manually change the dependency version in package.json
  3. 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
  4. The default @vue/test-utils version used for unit tests is bumped from 1.0.0-beta.29 to 1.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
    • #5149 feat(GeneratorAPI): allow passing options to api.extendPackage (@sodatea)
  • @vue/cli-plugin-unit-jest, @vue/cli-plugin-unit-mocha
    • #5147 feat: create projects with @vue/test-utils beta 31 (@sodatea)
  • @vue/cli-ui, @vue/cli
    • #5134 feat: lock minor versions when creating projects / adding plugins (@sodatea)
  • @vue/cli-plugin-typescript, @vue/cli-ui
  • @vue/cli
    • #5091 feat: vue upgrade monorepo support, --from option, and a new vue migrate --from command (@sodatea)
    • #4828 feat: add option --merge to create command (@zyy7259)
  • @vue/cli-service
  • @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
    • #5029 feat: don't throw on console/debugger statements for vue serve (@sodatea)

🐛 Bug Fix

  • @vue/cli-shared-utils, @vue/cli
    • #5150 fix: should infer package manager from config if there's no lockfile in the project (@sodatea)
    • #5045 refactor: use a plain http request to get package metadata (@sodatea)
  • @vue/cli
    • #5062 fix afterInvoke/onCreateComplete callbacks in Migrator (@sodatea)
    • #5038 fix: extendPackage dependency versions should be string (@pksunkara)
  • @vue/cli-ui, @vue/cli
    • #4985 fix(CORS): only allow connections from the designated host (@Akryum)
    • #5142 fix(CORS): fixup #4985, allow same-origin ws requests of any domain (@sodatea)
  • @vue/cli-plugin-e2e-cypress
  • @vue/cli-service
    • #5113 fix: correctly calculate cacheIdentifier from lockfiles (@sodatea)
  • @vue/cli-plugin-pwa
    • #5089 fix: pwa-plugin avoid generating manifest when path is an URL (@tkint)
  • @vue/cli-plugin-unit-jest, @vue/cli-plugin-unit-mocha
    • #5028 fix applyESLint when eslint plugin is added after unit test plugins (@sodatea)
  • @vue/cli-service, @vue/cli-test-utils
  • @vue/cli-plugin-e2e-nightwatch

📝 Documentation

🏠 Internal

  • @vue/babel-preset-app, @vue/cli-plugin-babel
    • #5133 refactor: remove usage of deprecated babel functions, preparing for babel 8 (@sodatea)
  • @vue/cli-service
    • #5123 fix: vue-template-compiler can be optional if @vue/compiler-sfc presents (@sodatea)
    • #5060 refactor: use the title option in the html template, instead of hard-code the project name (@sodatea)
  • @vue/cli
    • #5110 refactor: use env variables to set registry for package managers (@sodatea)
  • @vue/cli-shared-utils
    • #5092 refactor: use createRequire to load/resolve modules (@sodatea)
  • @vue/cli-plugin-router, @vue/cli-plugin-typescript, @vue/cli-service

Committers: 17

Assets 2
You can’t perform that action at this time.