Merge pull request #157 from unix/bundle

build: bundle in cjs mode is not compressed by default

package.json

@@ -4,6 +4,7 @@
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
+  "unpkg": "dist/index.min.js",
   "license": "MIT",
   "description": "Modern and minimalist React UI library.",
   "homepage": "https://react.zeit-ui.co",
@@ -102,4 +103,4 @@
   "dependencies": {
     "styled-jsx": "^3.2.5"
   }
-}
+}

rollup.config.js

@@ -1,5 +1,4 @@
 import commonjs from '@rollup/plugin-commonjs'
-import { terser } from 'rollup-plugin-terser'
 import nodeResolve from '@rollup/plugin-node-resolve'
 import localResolve from 'rollup-plugin-local-resolve'
 import babel from "rollup-plugin-babel"
@@ -11,6 +10,8 @@ const plugins = [
   babel({
     exclude: "node_modules/**",
     extensions,
+    presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript'],
+    plugins: ['styled-jsx/babel'],
   }),
   localResolve(),
   nodeResolve({
@@ -18,7 +19,6 @@ const plugins = [
     extensions,
   }),
   commonjs(),
-  // terser(),
 ]
 
 const globals = {
@@ -30,29 +30,27 @@ export default {
   input: 'components/index.ts',
   output: [
     {
-      file: pkg.main,
+      // file: pkg.main,
       format: 'cjs',
       exports: 'named',
+      dir: './dist',
       globals,
     },
-    {
-      file: pkg.module,
-      format: 'es',
-      exports: 'named',
-      globals,
-    },
-    {
-      file: pkg.browser,
-      format: 'umd',
-      exports: 'named',
-      globals,
-      name: 'ZeitUI',
-    },
+    // {
+    //   // file: 'dist/index.es.js',
+    //   format: 'es',
+    //   exports: 'named',
+    //   dir: 'dist',
+    //   globals,
+    // },
+    // {
+    //   file: pkg.browser,
+    //   format: 'umd',
+    //   exports: 'named',
+    //   globals,
+    //   name: 'ZeitUI',
+    // },
   ],
-  external: [
-    'react',
-    'react-dom',
-  ],
-  // external: id => /^react|react-dom|styled-jsx/.test(id),
+  external: id => /^react|react-dom|styled-jsx/.test(id),
   plugins: plugins,
 }

scripts/webpack.config.js

@@ -22,20 +22,19 @@ module.exports = async() => {
     .filter(r => r)
     .reduce((pre, current) => {
       return Object.assign({}, pre, { [current.name]: current.url })
-    }, { index: path.join(componentsPath, 'index.ts') })
+    }, {})
   
   console.log(`\n${Object.keys(componentsEntries).length} Components in total have been collected.`)
   console.log('Bundle now...')
-
-  return {
-    mode: 'production',
+  
+  const configs = {
+    mode: 'none',
     
     entry: componentsEntries,
     
     output: {
       filename: '[name].js',
       path: path.resolve(__dirname, '../dist'),
-      library: '',
       libraryTarget: 'commonjs',
     },
     
@@ -67,8 +66,8 @@ module.exports = async() => {
         //   amd: 'styled-jsx',
         // },
       },
-      function(context, request, done) {
-        if (/^styled-jsx/.test(request)){
+      function (context, request, done) {
+        if (/^styled-jsx/.test(request)) {
           return done(null, 'commonjs ' + request)
         }
         done()
@@ -89,4 +88,32 @@ module.exports = async() => {
       ],
     },
   }
+  
+  return [
+    configs,
+    {
+      ...configs,
+      
+      entry: {
+        index: path.join(componentsPath, 'index.ts'),
+      },
+    },
+    {
+      ...configs,
+      
+      mode: 'production',
+      
+      entry: {
+        'index.min': path.join(componentsPath, 'index.ts'),
+      },
+  
+      output: {
+        filename: '[name].js',
+        path: path.resolve(__dirname, '../dist'),
+        library: 'ZEITUI',
+        libraryTarget: 'umd',
+        globalObject: 'this',
+      },
+    },
+  ]
 }