Merge pull request #58 from panter/chore/init-rollup

feat: better packaging for distribution

Author: claudiocro

.babelrc

@@ -1,5 +1,5 @@
 {
-  "presets": [["@babel/env", { "modules": "commonjs" }]],
+  "presets": [["@babel/env"]],
   "plugins": [
     "add-module-exports",
     "@babel/plugin-proposal-object-rest-spread"

package.json

@@ -19,10 +19,10 @@
     "vue.js"
   ],
   "scripts": {
+    "roll": "rollup",
     "prepublish": "npm run build",
     "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
-    "build": "cross-env webpack --mode=production --progress --hide-modules && npm run build:lib",
-    "build:lib": "rimraf ./lib && babel src --out-dir lib",
+    "build": "cross-env NODE_ENV=production rollup -c rollup.config.js",
     "lint": "eslint src/**.js",
     "test": "npm run lint && npm run test:unit && npm run test:types",
     "test:unit": "cross-env BABEL_ENV=test karma start test/karma.conf.js",
@@ -35,7 +35,9 @@
     "docs:clean": "rm -rf docs/.vuepress/**",
     "docs:build": "vuepress build docs"
   },
-  "main": "./dist/vue-i18next.js",
+  "main": "./dist/vue-i18next.common.js",
+  "module": "./dist/vue-i18next.esm.js",
+  "unpkg": "./dist/vue-i18next.js",
   "types": "typings/index.d.ts",
   "peerDependencies": {
     "i18next": ">= 6.0.1",
@@ -88,12 +90,15 @@
     "ncp": "^2.0.0",
     "phantomjs-prebuilt": "^2.1.14",
     "rimraf": "^2.6.1",
+    "rollup": "^0.66.0",
+    "rollup-plugin-buble": "^0.19.2",
+    "rollup-plugin-commonjs": "^9.1.8",
+    "rollup-plugin-node-resolve": "^3.4.0",
+    "rollup-plugin-replace": "^2.0.0",
     "semantic-release": "^6.3.6",
     "sinon": "^2.1.0",
     "sinon-chai": "^2.8.0",
     "typescript": "^2.8.3",
-    "uglifyjs-3-webpack-plugin": "^1.2.4",
-    "uglifyjs-webpack-plugin": "^2.1.1",
     "vue": "^2.5.16",
     "vue-class-component": "^6.2.0",
     "vue-loader": "^10.0.0",

rollup.config.js

@@ -0,0 +1,33 @@
+const path = require('path');
+const pack = require('./package.json');
+const replace = require('rollup-plugin-replace');
+// const flow = require('rollup-plugin-flow-no-whitespace');
+const buble = require('rollup-plugin-buble');
+const node = require('rollup-plugin-node-resolve');
+const cjs = require('rollup-plugin-commonjs');
+
+const resolve = _path => path.resolve(__dirname, _path);
+const name = 'VueI18next';
+const fileName = 'vue-i18next';
+const replacePluginOptions = { __VERSION__: `"${pack.version}"` };
+
+const rollupPlugins = () => [
+  replace(replacePluginOptions),
+  buble({ objectAssign: 'Object.assign' }),
+  node(),
+  cjs(),
+];
+
+const conf = (format, formatName) => ({
+  input: 'src/i18n.js',
+  plugins: rollupPlugins(),
+  external: ['deepmerge'],
+  output: {
+    file: resolve(`dist/${fileName}${formatName ? `.${formatName}` : ''}.js`),
+    format,
+    env: 'production',
+    name,
+  },
+});
+
+export default [conf('cjs', 'common'), conf('es', 'esm'), { ...conf('umd'), external: [] }];

typings/tsconfig.json

@@ -2,6 +2,7 @@
   "compilerOptions": {
     "module": "es2015",
     "moduleResolution": "node",
+    "target": "es2015",
     "allowSyntheticDefaultImports": true,
     "experimentalDecorators": true,
     "strict": true,

webpack.config.js

@@ -1,17 +1,13 @@
 const path = require('path');
 const webpack = require('webpack');
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 const config = require('./package.json');
 
 module.exports = {
+  mode: 'development',
   entry: './src/i18n.js',
   output: {
     path: path.resolve(__dirname, './dist'),
     publicPath: '/dist/',
-    filename: 'vue-i18next.js',
-    library: ['VueI18next'],
-    libraryTarget: 'umd',
-    umdNamedDefine: true,
   },
   module: {
     rules: [
@@ -46,22 +42,3 @@ module.exports = {
   },
   devtool: '#eval-source-map',
 };
-
-// if (process.env.NODE_ENV === 'production') {
-module.exports.optimization = {
-  minimizer: [new UglifyJsPlugin({ sourceMap: true })],
-};
-
-module.exports.devtool = '#source-map';
-// http://vue-loader.vuejs.org/en/workflow/production.html
-module.exports.plugins = (module.exports.plugins || []).concat([
-  new webpack.DefinePlugin({
-    'process.env': {
-      NODE_ENV: '"production"',
-    },
-  }),
-  // new webpack.LoaderOptionsPlugin({
-  //   minimize: true,
-  // }),
-]);
-// }