Merge pull request #54 from homer0/next

v6.0.0

.nvmrc

@@ -1 +1 @@
-8.10
+10.13

.travis.yml

@@ -1,6 +1,6 @@
 language: node_js
 node_js:
-  - "8.11"
-  - "10.15"
+  - "10.18"
+  - "12.14"
 after_success:
   - 'cat ./coverage/lcov.info | ./node_modules/.bin/coveralls'

README.md

@@ -17,7 +17,7 @@ Allows [projext](https://yarnpkg.com/en/package/projext) to use [Rollup](https:/
 |--------------|-------------------------------------------------------------------------------|
 | Package      | projext-plugin-rollup                                                         |
 | Description  | Allows projext to use Rollup as a build engine.                               |
-| Node Version | >= v8.0.0                                                                    |
+| Node Version | >= v10.13.0                                                                    |
 
 ## Usage
 
@@ -200,6 +200,14 @@ module.exports = (params) => ({
 
 That change will only be applied when building the target `myApp` on a production build.
 
+### Code splitting
+
+Using code splitting with projext is quite simple, you can [read about it on the site](https://homer0.github.io/projext/manual/codeSplitting.html), but when it comes to Rollup, there's something you should be aware: The script tag for the bundle will use [`type="module"`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules).
+
+When you use code splitting with Rollup, Rollup will automatically take shared code between the chunks in order to create a "shared chunk", the "problem" is that the shared chunk is loaded using `import ... from '...'`, and when declared like that, `import` can only be used on scripts loaded using the `type="module"` attribute.
+
+This makes it impossible to target old browsers and implement code splitting at the same time, so it may be recommendable to use a direct implementation of Rollup, with different builds, or [the webpack build engine](https://yarnpkg.com/en/package/projext-plugin-webpack).
+
 ## Making a plugin
 
 If you want to write a plugin that works with this one (like a framework plugin), there are a lot of reducer events you can listen for and use to modify the Rollup configuration:
@@ -258,11 +266,11 @@ I use [Jest](https://facebook.github.io/jest/) with [Jest-Ex](https://yarnpkg.co
 
 ### Linting
 
-I use [ESlint](http://eslint.org) to validate all our JS code. The configuration file for the project code is on `./.eslintrc` and for the tests on `./tests/.eslintrc` (which inherits from the one on the root), there's also an `./.eslintignore` to ignore some files on the process, and the script that runs it is on `./utils/scripts/lint`.
+I use [ESlint](http://eslint.org) with [my own custom configuration](http://yarnpkg.com/en/package/eslint-plugin-homer0) to validate all the JS code. The configuration file for the project code is on `./.eslintrc` and for the tests on `./tests/.eslintrc`, there's also an `./.eslintignore` to ignore some files on the process, and the script that runs it is on `./utils/scripts/lint`.
 
 ### Documentation
 
-I use [ESDoc](http://esdoc.org) to generate HTML documentation for the project. The configuration file is on `./.esdocrc` and the script that runs it is on `./utils/scripts/docs`.
+I use [ESDoc](https://esdoc.org) to generate HTML documentation for the project. The configuration file is on `./.esdocrc` and the script that runs it is on `./utils/scripts/docs`.
 
 ### To-Dos
 

package.json

@@ -2,68 +2,63 @@
     "name": "projext-plugin-rollup",
     "description": "Allows projext to use Rollup as a build engine.",
     "homepage": "https://homer0.github.io/projext-plugin-rollup/",
-    "version": "5.1.1",
+    "version": "6.0.0",
     "repository": "homer0/projext-plugin-rollup",
     "author": "Leonardo Apiwan (@homer0) <me@homer0.com>",
     "license": "MIT",
     "dependencies": {
-      "projext": "^7.2.0",
-      "wootils": "^2.6.5",
+      "projext": "^8.0.0",
+      "wootils": "^3.0.1",
       "jimple": "^1.5.0",
       "fs-extra": "^8.1.0",
       "extend": "^3.0.2",
       "magic-string": "0.25.4",
 
-      "rollup": "^1.25.1",
-      "rollup-plugin-commonjs": "^10.1.0",
-      "rollup-plugin-node-resolve": "^5.2.0",
-      "rollup-plugin-terser": "^5.1.2",
+      "rollup": "^1.27.14",
+      "@rollup/plugin-commonjs": "^11.0.0",
+      "@rollup/plugin-node-resolve": "^6.0.0",
+      "rollup-plugin-terser": "^5.1.3",
       "rollup-plugin-html": "0.2.1",
       "rollup-plugin-babel": "^4.3.3",
-      "rollup-plugin-json": "^4.0.0",
-      "rollup-plugin-replace": "^2.2.0",
+      "@rollup/plugin-json": "^4.0.1",
+      "@rollup/plugin-replace": "^2.3.0",
       "rollup-plugin-sass": "^1.2.2",
       "rollup-pluginutils": "^2.8.2",
-      "rollup-plugin-polyfill": "^3.0.0",
-      "rollup-plugin-visualizer": "^2.6.0",
+      "rollup-plugin-visualizer": "^3.3.1",
 
       "builtin-modules": "^3.1.0",
 
-      "postcss": "^7.0.18",
+      "postcss": "^7.0.25",
       "postcss-modules": "^1.4.1",
 
-      "node-sass": "^4.12.0",
+      "node-sass": "^4.13.0",
       "mime": "^2.4.4",
       "opener": "^1.5.1",
       "prettysize": "^2.0.0",
       "colors": "^1.4.0",
       "statuses": "^1.5.0",
 
-      "core-js": "^3.3.3",
-      "regenerator-runtime": "0.13.3",
-
-      "@babel/core": "7.6.4",
-      "@babel/preset-env": "7.6.3"
+      "@babel/core": "7.7.7",
+      "@babel/preset-env": "7.7.7"
     },
     "devDependencies": {
-      "eslint": "^6.5.1",
-      "eslint-plugin-homer0": "^2.0.1",
-      "@babel/plugin-transform-runtime": "7.6.2",
-      "jest-ex": "^6.1.1",
+      "eslint": "^6.8.0",
+      "eslint-plugin-homer0": "^3.0.0",
+      "@babel/plugin-transform-runtime": "7.7.6",
+      "jest-ex": "^7.0.1",
       "jest-cli": "^24.9.0",
       "jasmine-expect": "^4.0.3",
-      "jimpex": "^4.0.3",
+      "jimpex": "^5.0.0",
       "esdoc": "^1.1.0",
       "esdoc-standard-plugin": "^1.0.0",
       "esdoc-node": "1.0.4",
-      "leasot": "^8.3.0",
-      "coveralls": "^3.0.7",
-      "husky": "^3.0.9"
+      "leasot": "^9.3.1",
+      "coveralls": "^3.0.9",
+      "husky": "^3.1.0"
     },
     "engine-strict": true,
     "engines": {
-      "node": ">=8.10.0",
-      "npm": ">=3.0.0"
+      "node": ">=10.13.0"
     },
     "main": "src/index.js",
     "husky": {

src/index.js

@@ -37,7 +37,6 @@ const loadPlugin = (app) => {
       'express',
       'jimpex',
     ],
-    babelPolyfill: 'polyfill.js',
   }));
   // Register the main services of the build engine.
   app.register(rollupConfiguration);

src/plugins/runtimeReplace/index.js

@@ -1,6 +1,6 @@
-const replace = require('rollup-plugin-replace');
+const replace = require('@rollup/plugin-replace');
 /**
- * This is a Rollup plugin that works as a wrapper for `rollup-plugin-replace` in order to reload
+ * This is a Rollup plugin that works as a wrapper for `@rollup/plugin-replace` in order to reload
  * all definitions when the bundle changes.
  */
 class ProjextRollupRuntimeReplacePlugin {
@@ -36,7 +36,7 @@ class ProjextRollupRuntimeReplacePlugin {
      */
     this._values = {};
     /**
-     * The instance of the real `rollup-plugin-replace` this plugin will call on `transform`.
+     * The instance of the real `@rollup/plugin-replace` this plugin will call on `transform`.
      * @type {Object}
      * @access protected
      * @ignore
@@ -45,7 +45,7 @@ class ProjextRollupRuntimeReplacePlugin {
     /**
      * This is a flag the plugin uses to avoid reload the definitions on the first build, since at
      * that point, the definitions were already loaded in order to create the
-     * `rollup-plugin-replace` instance.
+     * `@rollup/plugin-replace` instance.
      * @type {boolean}
      * @access protected
      * @ignore
@@ -64,7 +64,7 @@ class ProjextRollupRuntimeReplacePlugin {
    * This is called when Rollup starts the building process; if it's not the first build, it will
    * reload the definitions. The reason it doesn't load them on the first build it's because
    * when the plugin is instantiated, the definitions are already loaded for the
-   * `rollup-plugin-replace` instance creation.
+   * `@rollup/plugin-replace` instance creation.
    */
   buildStart() {
     if (this._firstReload) {
@@ -75,10 +75,10 @@ class ProjextRollupRuntimeReplacePlugin {
   }
   /**
    * This is called by Rollup when is parsing a file, and it just "forwards the call" to
-   * `rollup-plugin-replace`.
+   * `@rollup/plugin-replace`.
    * @param {string} code     The file contents.
    * @param {string} filepath The file path.
-   * @return {*} Whatever `rollup-plugin-replace` returns.
+   * @return {*} Whatever `@rollup/plugin-replace` returns.
    */
   transform(code, filepath) {
     return this._replace.transform(code, filepath);
@@ -93,7 +93,7 @@ class ProjextRollupRuntimeReplacePlugin {
     return this._values;
   }
   /**
-   * Creates an instance of `rollup-plugin-replace` using the definitions as options.
+   * Creates an instance of `@rollup/plugin-replace` using the definitions as options.
    * @return {Object}
    * @access protected
    * @ignore

src/plugins/template/index.js

@@ -114,7 +114,19 @@ class ProjextRollupTemplatePlugin {
     const async = this._options.scriptsAsync ? ' async="async"' : '';
     // Create all the script tags.
     const scripts = this._options.scripts
-    .map((url) => `<script type="text/javascript" src="${url}"${async}></script>`);
+    .map((url) => {
+      let script;
+      if (typeof url === 'string') {
+        script = `<script type="text/javascript" src="${url}"${async}></script>`;
+      } else if (!url.src) {
+        throw new Error(`${this.name}: Missing 'src' property on script object`);
+      } else {
+        const attributes = this._toHTMLAttributes(url);
+        script = `<script ${attributes}></script>`;
+      }
+
+      return script;
+    });
     // Create all the stylesheet links.
     const stylesheets = this._options.stylesheets
     .map((url) => `<link href="${url}" rel="stylesheet" />`);
@@ -256,6 +268,28 @@ class ProjextRollupTemplatePlugin {
     // Return the final list.
     return result;
   }
+  /**
+   * Transform a dictionary into a string of HTML attributes.
+   * @example
+   * _toHTMLAttributes({ w: 'x', y: 'z' });
+   * // w="x" y="z"
+   *
+   * @param {Object} obj The dictionary to transform.
+   * @return {String}
+   * @access protected
+   * @ignore
+   */
+  _toHTMLAttributes(obj) {
+    return Object.keys(obj)
+    .reduce(
+      (acc, name) => {
+        const value = `${obj[name]}`.replace(/"/, '\\"');
+        return [...acc, `${name}="${value}"`];
+      },
+      []
+    )
+    .join(' ');
+  }
 }
 /**
  * Shorthand method to create an instance of {@link ProjextRollupTemplatePlugin}.

src/plugins/windowAsGlobal/index.js

@@ -9,7 +9,11 @@ class ProjextRollupWindowAsGlobalPlugin {
    * @return {string}
    */
   intro() {
-    return 'var global = typeof window !== \'undefined\' ? window : {};';
+    return [
+      'if (typeof window !== \'undefined\' && typeof window.global === \'undefined\') {',
+      'window.global = window;',
+      '}',
+    ].join(' ');
   }
 }
 /**

src/services/configurations/browserDevelopmentConfiguration.js

@@ -1,10 +1,9 @@
-const resolve = require('rollup-plugin-node-resolve');
+const resolve = require('@rollup/plugin-node-resolve');
 const babel = require('rollup-plugin-babel');
-const commonjs = require('rollup-plugin-commonjs');
+const commonjs = require('@rollup/plugin-commonjs');
 const sass = require('rollup-plugin-sass');
 const html = require('rollup-plugin-html');
-const json = require('rollup-plugin-json');
-const polyfill = require('rollup-plugin-polyfill');
+const json = require('@rollup/plugin-json');
 const visualizer = require('rollup-plugin-visualizer');
 
 const { provider } = require('jimple');
@@ -98,11 +97,6 @@ class RollupBrowserDevelopmentConfiguration extends ConfigurationFile {
       resolve(pluginSettings.resolve),
       commonjs(pluginSettings.commonjs),
       babel(pluginSettings.babel),
-      ...(
-        pluginSettings.polyfill.length ?
-          [polyfill(pluginSettings.polyfill)] :
-          []
-      ),
       windowAsGlobal(),
       runtimeReplace(definitions),
       ...(

src/services/configurations/browserProductionConfiguration.js

@@ -1,10 +1,9 @@
-const resolve = require('rollup-plugin-node-resolve');
+const resolve = require('@rollup/plugin-node-resolve');
 const babel = require('rollup-plugin-babel');
-const commonjs = require('rollup-plugin-commonjs');
+const commonjs = require('@rollup/plugin-commonjs');
 const sass = require('rollup-plugin-sass');
 const html = require('rollup-plugin-html');
-const json = require('rollup-plugin-json');
-const polyfill = require('rollup-plugin-polyfill');
+const json = require('@rollup/plugin-json');
 const { terser } = require('rollup-plugin-terser');
 const visualizer = require('rollup-plugin-visualizer');
 
@@ -91,11 +90,6 @@ class RollupBrowserProductionConfiguration extends ConfigurationFile {
       resolve(pluginSettings.resolve),
       commonjs(pluginSettings.commonjs),
       babel(pluginSettings.babel),
-      ...(
-        pluginSettings.polyfill.length ?
-          [polyfill(pluginSettings.polyfill)] :
-          []
-      ),
       windowAsGlobal(),
       runtimeReplace(definitions),
       ...(

src/services/configurations/nodeDevelopmentConfiguration.js

@@ -1,10 +1,9 @@
-const resolve = require('rollup-plugin-node-resolve');
+const resolve = require('@rollup/plugin-node-resolve');
 const babel = require('rollup-plugin-babel');
-const commonjs = require('rollup-plugin-commonjs');
+const commonjs = require('@rollup/plugin-commonjs');
 const sass = require('rollup-plugin-sass');
 const html = require('rollup-plugin-html');
-const json = require('rollup-plugin-json');
-const polyfill = require('rollup-plugin-polyfill');
+const json = require('@rollup/plugin-json');
 const visualizer = require('rollup-plugin-visualizer');
 
 const { provider } = require('jimple');
@@ -85,11 +84,6 @@ class RollupNodeDevelopmentConfiguration extends ConfigurationFile {
       resolve(pluginSettings.resolve),
       commonjs(pluginSettings.commonjs),
       babel(pluginSettings.babel),
-      ...(
-        pluginSettings.polyfill.length ?
-          [polyfill(pluginSettings.polyfill)] :
-          []
-      ),
       ...(
         pluginSettings.moduleReplace.instructions.length ?
           [moduleReplace(pluginSettings.moduleReplace)] :

src/services/configurations/nodeProductionConfiguration.js

@@ -1,10 +1,9 @@
-const resolve = require('rollup-plugin-node-resolve');
+const resolve = require('@rollup/plugin-node-resolve');
 const babel = require('rollup-plugin-babel');
-const commonjs = require('rollup-plugin-commonjs');
+const commonjs = require('@rollup/plugin-commonjs');
 const sass = require('rollup-plugin-sass');
 const html = require('rollup-plugin-html');
-const json = require('rollup-plugin-json');
-const polyfill = require('rollup-plugin-polyfill');
+const json = require('@rollup/plugin-json');
 const visualizer = require('rollup-plugin-visualizer');
 
 const { provider } = require('jimple');
@@ -84,11 +83,6 @@ class RollupNodeProductionConfiguration extends ConfigurationFile {
       resolve(pluginSettings.resolve),
       commonjs(pluginSettings.commonjs),
       babel(pluginSettings.babel),
-      ...(
-        pluginSettings.polyfill.length ?
-          [polyfill(pluginSettings.polyfill)] :
-          []
-      ),
       ...(
         pluginSettings.moduleReplace.instructions.length ?
           [moduleReplace(pluginSettings.moduleReplace)] :