feat: upgrade to Babel 7 (#3667)

.babelrc

@@ -2,10 +2,10 @@
   "env": {
     "test": {
       "presets": [
-        ["env", {                                                                                                                              
+        ["@babel/env", {
-          "targets": {                                                                                                                                       
+          "targets": {
-            "node": "current"                                                                                                                                
+            "node": "current"
-          }                                                                                                                                                  
+          }
         }]
       ]
     }

examples/typescript/components/Card.vue

@@ -20,8 +20,9 @@ import * as people from '~/store/modules/people'
 
 const PeopleAction = namespace(people.name, Action)
 
+export default
 @Component({})
-export default class Card extends Vue {
+class Card extends Vue {
   @Prop() person
   @PeopleAction select
 }

examples/typescript/pages/index.vue

@@ -24,12 +24,13 @@ import * as people from '~/store/modules/people'
 const PeopleState = namespace(people.name, State)
 const PeopleGetter = namespace(people.name, Getter)
 
+export default
 @Component({
   components: {
     Card
   }
 })
-export default class extends Vue {
+class extends Vue {
   @PeopleState selected
   @PeopleState people
   @PeopleGetter selectedPerson

examples/vue-class-component/components/Base.vue

@@ -13,12 +13,13 @@
 import Vue from 'vue'
 import Component from 'nuxt-class-component'
 
+export default
 @Component({
   props: {
     env: String
   }
 })
-export default class Base extends Vue {
+class Base extends Vue {
   // initial data
   msg = 123
 

examples/vue-class-component/components/Child.vue

@@ -13,8 +13,9 @@
 import Component from 'nuxt-class-component'
 import Base from '@/components/Base'
 
+export default
 @Component
-export default class Child extends Base {
+class Child extends Base {
   // override parent method
   greet() {
     console.log('child greeting: ' + this.msg) // eslint-disable-line no-console

examples/vue-class-component/nuxt.config.js

@@ -1,7 +0,0 @@
-export default {
-  build: {
-    babel: {
-      plugins: ['transform-decorators-legacy', 'transform-class-properties']
-    }
-  }
-}

examples/vue-class-component/package.json

@@ -1,10 +1,8 @@
 {
   "name": "example-vue-class-component",
   "dependencies": {
-    "babel-plugin-transform-class-properties": "^6.24.1",
+    "nuxt-edge": "latest",
-    "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "nuxt-class-component": "latest"
-    "nuxt": "latest",
-    "nuxt-class-component": "^1.0.4"
   },
   "scripts": {
     "dev": "nuxt",

examples/vue-class-component/pages/index.vue

@@ -7,10 +7,11 @@ import Vue from 'vue'
 import Component from 'nuxt-class-component'
 import Child from '@/components/Child'
 
+export default
 @Component({
   components: { Child }
 })
-export default class App extends Vue {
+class App extends Vue {
   asyncData({ req }) {
     return { env: req ? 'server' : 'client' }
   }

lib/app/index.js

@@ -1,4 +1,3 @@
-import 'es6-promise/auto'
 import Vue from 'vue'
 import Meta from 'vue-meta'
 import { createRouter } from './router.js'

lib/builder/webpack/base.js

@@ -32,9 +32,9 @@ export default class WebpackBaseConfig {
     if (!options.babelrc && !options.presets) {
       options.presets = [
         [
-          require.resolve('babel-preset-vue-app'),
+          require.resolve('@nuxtjs/babel-preset-app'),
           {
-            targets: this.isServer ? { node: 'current' } : { ie: 9, uglify: true }
+            buildTarget: this.isServer ? 'server' : 'client'
           }
         ]
       ]
@@ -281,7 +281,6 @@ export default class WebpackBaseConfig {
         modules: webpackModulesDir
       },
       module: {
-        noParse: /es6-promise\.js$/, // Avoid webpack shimming process
         rules: this.rules()
       },
       plugins: this.plugins()

lib/builder/webpack/client.js

@@ -91,7 +91,7 @@ export default class WebpackClientConfig extends WebpackBaseConfig {
       config.optimization.splitChunks.cacheGroups.commons === undefined
     ) {
       config.optimization.splitChunks.cacheGroups.commons = {
-        test: /node_modules[\\/](vue|vue-loader|vue-router|vuex|vue-meta|core-js|babel-runtime|es6-promise|axios|webpack|setimmediate|timers-browserify|process|regenerator-runtime|cookie|js-cookie|is-buffer|dotprop|nuxt\.js)[\\/]/,
+        test: /node_modules[\\/](vue|vue-loader|vue-router|vuex|vue-meta|core-js|@babel\/runtime|axios|webpack|setimmediate|timers-browserify|process|regenerator-runtime|cookie|js-cookie|is-buffer|dotprop|nuxt\.js)[\\/]/,
         chunks: 'all',
         priority: 10,
         name: true

lib/builder/webpack/server.js

@@ -65,7 +65,6 @@ export default class WebpackServerConfig extends BaseConfig {
         config.externals.push(
           nodeExternals({
             whitelist: [
-              /es6-promise|\.(?!(?:js|json)$).{1,5}$/i,
               /\.css$/,
               /\?vue&type=style/,
               ...this.options.build.transpile

lib/builder/webpack/utils/perf-loader.js

@@ -22,7 +22,7 @@ export default class PerfLoader {
   }
 
   warmupAll() {
-    this.warmup(this.workerPools.js, ['babel-loader', 'babel-preset-env'])
+    this.warmup(this.workerPools.js, ['babel-loader', '@babel/preset-env'])
     this.warmup(this.workerPools.css, ['css-loader'])
   }
 

lib/nuxt-legacy.js

@@ -1,4 +1,4 @@
-import 'babel-polyfill'
+import '@babel/polyfill'
 
 import consola from 'consola'
 

package.json

@@ -70,12 +70,12 @@
     "npm": ">=5.0.0"
   },
   "dependencies": {
+    "@babel/core": "7.0.0-rc.1",
+    "@nuxtjs/babel-preset-app": "^0.3.0",
     "@nuxtjs/friendly-errors-webpack-plugin": "^2.0.2",
     "@nuxtjs/youch": "^4.2.3",
     "autoprefixer": "^8.6.4",
-    "babel-core": "^6.26.3",
+    "babel-loader": "^8.0.0-beta",
-    "babel-loader": "^7.1.4",
-    "babel-preset-vue-app": "^2.0.0",
     "cache-loader": "^1.2.2",
     "caniuse-lite": "^1.0.30000862",
     "chalk": "^2.4.1",
@@ -86,7 +86,6 @@
     "css-loader": "^1.0.0",
     "cssnano": "^4.0.5",
     "debug": "^3.1.0",
-    "es6-promise": "^4.2.4",
     "esm": "^3.0.74",
     "etag": "^1.8.1",
     "file-loader": "^1.1.11",
@@ -138,11 +137,11 @@
     "webpackbar": "^2.6.1"
   },
   "devDependencies": {
-    "babel-eslint": "^8.2.6",
+    "@babel/plugin-external-helpers": "7.0.0-rc.1",
+    "@babel/polyfill": "7.0.0-rc.1",
+    "babel-core": "^7.0.0-0",
+    "babel-eslint": "^9.0.0-beta",
     "babel-jest": "^23.0.1",
-    "babel-plugin-external-helpers": "^6.22.0",
-    "babel-polyfill": "^6.26.0",
-    "babel-preset-env": "^1.7.0",
     "codecov": "^3.0.2",
     "cross-env": "^5.2.0",
     "eslint": "^4.19.1",
@@ -168,7 +167,7 @@
     "request-promise-native": "^1.0.5",
     "rimraf": "^2.6.2",
     "rollup": "^0.59.4",
-    "rollup-plugin-babel": "^3.0.4",
+    "rollup-plugin-babel": "^4.0.0-beta.8",
     "rollup-plugin-commonjs": "^9.1.3",
     "rollup-plugin-json": "^3.0.0",
     "rollup-plugin-license": "^0.7.0"

scripts/rollup/externals.js

@@ -9,7 +9,7 @@ const nodeBuiltIn = ['path', 'fs', 'module', 'crypto', 'util']
 // Optional dependencies that user should install on demand
 const optionalDependencies = [
   // legacy build users need this
-  'babel-polyfill'
+  '@babel/polyfill'
 ]
 
 const externals = [].concat(

scripts/rollup/nuxt-legacy.js

@@ -10,14 +10,14 @@ export default config({
       exclude: 'node_modules/**',
       presets: [
         [
-          'env',
+          '@babel/preset-env',
           {
             'modules': false
           }
         ]
       ],
       plugins: [
-        'external-helpers'
+        '@babel/external-helpers'
       ]
     })
   ]

test/unit/wp.config.test.js

@@ -18,7 +18,7 @@ describe('webpack configuration', () => {
     perfLoader.warmup = jest.fn()
     perfLoader.warmupAll()
     expect(perfLoader.warmup).toHaveBeenCalledTimes(2)
-    expect(perfLoader.warmup).toHaveBeenCalledWith(js, ['babel-loader', 'babel-preset-env'])
+    expect(perfLoader.warmup).toHaveBeenCalledWith(js, ['babel-loader', '@babel/preset-env'])
     expect(perfLoader.warmup).toHaveBeenCalledWith(css, ['css-loader'])
 
     const loaders = perfLoader.pool('js', { loader: 'test-perf-loader' })

test/utils/setup.js

@@ -1,5 +1,4 @@
 // eslint-disable
-require('babel-polyfill')
 require('consola').clear().add({
   log: jest.fn()
 })