fix: v0.x dist builds to ensure SSR works properly and popper.js is included in the dist builds (#146)

* fix: v0.x dist builds to ensure SSR works properly

* fix: Ensure /dist folder structure uses best-practice with module types separated by folder.

Author: virgofx

.babelrc

@@ -1,4 +1,18 @@
 {
-  "presets": [["env", { "modules": false }], "stage-2", "react"],
-  "plugins": ["transform-class-properties"]
+  "presets": [
+    ["env", { "modules": false }],
+    "stage-2",
+    "react"
+  ],
+  "plugins": [
+    "external-helpers",
+    "transform-class-properties"
+  ],
+  "env": {
+    "production": {
+      "plugins": [
+        ["transform-react-remove-prop-types", { "removeImport": true }]
+      ]
+    }
+  }
 }

README.md

@@ -12,11 +12,23 @@ React wrapper around [PopperJS](https://github.com/FezVrasta/popper.js/).
 
 `npm install react-popper --save` or `yarn add react-popper`
 
+
+### CDN
+
+If you prefer to include React Popper globally by marking `react-popper` as external in your application, the `react-popper` library (exposed as `ReactPopper`) provides various single-file distributions, which are hosted on the following CDNs:
+
+* [**cdnjs**](https://cdnjs.com/libraries/react-popper)
 ```html
-<script src="https://unpkg.com/react-popper/dist/react-popper.js"></script>
-(UMD library exposed as `ReactPopper`)
+<script src="https://cdnjs.cloudflare.com/ajax/libs/react-popper/0.10.2/umd/react-popper.min.js"></script>
 ```
 
+* [**unpkg**](https://unpkg.com/react-popper/)
+```html
+<script src="https://unpkg.com/[email protected]/dist/umd/react-popper.min.js"></script>
+```
+
+> **Note**: To load a specific version of React Popper replace `0.10.2` with the version number.
+
 ## Usage
 
 ```js

package.json

@@ -15,13 +15,11 @@
     "react-popper.d.ts"
   ],
   "scripts": {
-    "build": "npm run build:clean && npm run build:es && npm run build:umd && npm run build:cjs && npm run build:umd-min && npm run build:cjs-min",
+    "build": "npm run build:clean && npm run build:es && npm run build:dist && npm run build:dist:prod",
     "build:clean": "rm -rf dist/ && rm -rf lib/",
     "build:es": "babel src --out-dir lib && mv lib/index.js lib/react-popper.js",
-    "build:umd": "rollup -c --output.format umd --output.name ReactPopper --output.file dist/react-popper.umd.js",
-    "build:cjs": "rollup -c --output.format cjs --output.name ReactPopper --output.file dist/react-popper.js",
-    "build:umd-min": "MINIFY=true rollup -c --output.format umd --output.name ReactPopper --output.file dist/react-popper.umd.min.js",
-    "build:cjs-min": "MINIFY=true rollup -c --output.format cjs --output.name ReactPopper --output.file dist/react-popper.min.js",
+    "build:dist": "rollup -c",
+    "build:dist:prod": "NODE_ENV=production rollup -c",
     "demo": "parcel --out-dir demo/dist demo/index.html",
     "prepare": "npm run build",
     "precommit": "lint-staged",

rollup.config.js

@@ -1,26 +1,50 @@
 import babel from 'rollup-plugin-babel';
 import minify from 'rollup-plugin-babel-minify';
+import replace from 'rollup-plugin-replace';
+import nodeResolve from 'rollup-plugin-node-resolve';
 
-export default {
-  input: 'src/index.js',
-  plugins: [
-    babel({
-      babelrc: false,
-      presets: [['env', { modules: false }], 'stage-2', 'react'],
-      plugins: [
-        'external-helpers',
-        ['transform-react-remove-prop-types', { mode: 'wrap' }],
-      ],
-    }),
-    process.env.MINIFY ? minify() : false,
-  ].filter(Boolean),
-  external: ['react', 'react-dom', 'prop-types', 'popper.js'],
-  output: {
-    sourcemap: true,
-    globals: {
-      react: 'React',
-      'prop-types': 'PropTypes',
-      'popper.js': 'Popper',
+const baseConfig = (outputFormat) => {
+  const isProduction = process.env.NODE_ENV === 'production';
+
+  let file;
+  switch (outputFormat) {
+    case 'umd':
+    case 'cjs':
+      file = 'dist/' + outputFormat + '/react-popper' + (isProduction ? '.min' : '') + '.js';
+      break;
+
+    default:
+      throw new Error('Unsupported output format: ' + outputFormat);
+  }
+
+  return {
+    input: 'src/index.js',
+    plugins: [
+      nodeResolve(),
+      babel(),
+      replace({
+        'process.env.NODE_ENV': JSON.stringify('production')
+      }),
+      isProduction ? minify({
+        comments: false,
+      }) : false,
+    ],
+    external: ['react', 'react-dom', 'prop-types', 'popper.js'],
+    output: {
+      name: 'ReactPopper',
+      file: file,
+      format: outputFormat,
+      sourcemap: true,
+      globals: {
+        react: 'React',
+        'prop-types': 'PropTypes',
+        'popper.js': 'Popper',
+      },
     },
-  },
+  };
 };
+
+export default [
+  baseConfig('cjs'),
+  baseConfig('umd'),
+];