fix(babel): Use babel when building

Author: AMontagu

babel.config.js

@@ -1,5 +1,7 @@
 module.exports = {
   presets: [
-    '@vue/cli-plugin-babel/preset'
-  ]
+    '@vue/cli-plugin-babel/preset',
+    '@babel/preset-env'
+  ],
+  plugins: [['@babel/plugin-transform-runtime', { useESModules: true }]]
 }

build/rollup.config.js

@@ -7,6 +7,7 @@ import ts from 'rollup-plugin-typescript2';
 import replace from '@rollup/plugin-replace';
 import resolve from '@rollup/plugin-node-resolve';
 import commonjs from '@rollup/plugin-commonjs';
+import { babel } from '@rollup/plugin-babel';
 import pascalcase from 'pascalcase';
 
 const pkg = require('../package.json');
@@ -136,6 +137,8 @@ function createConfig(format, output, plugins = []) {
         isNodeBuild,
       ),
       ...nodePlugins,
+      // Babel plugin need to be placed after commonjs plugin
+      babel({ babelHelpers: 'runtime' }),
       ...plugins,
     ],
     output,
@@ -171,6 +174,7 @@ function createReplacePlugin(
     __GLOBAL__: isGlobalBuild,
     // is targeting Node (SSR)?
     __NODE_JS__: isNodeBuild,
+    preventAssignment: true
   };
   // allow inline overrides like
   //__RUNTIME_COMPILE__=true yarn build

package-lock.json

@@ -34,6 +34,8 @@
     }
   },
   "devDependencies": {
+    "@babel/plugin-transform-runtime": "^7.13.10",
+    "@rollup/plugin-babel": "^5.3.0",
     "@rollup/plugin-commonjs": "^17.1.0",
     "@rollup/plugin-node-resolve": "^11.2.0",
     "@rollup/plugin-replace": "^2.4.1",

package.json

@@ -10,7 +10,7 @@
   "dependencies": {
     "core-js": "^3.6.5",
     "vue": "^2.6.11",
-    "vue-datatable-url-sync": "^0.1.0",
+    "vue-datatable-url-sync": "^1.0.1",
     "vue-router": "^3.2.0",
     "vuetify": "^2.4.0"
   },