Use rollup to bundle JS (ES6 modules)

Shasthojoy · Jun 15, 2018 · 72bda8f · 72bda8f
1 parent f49ff38
commit 72bda8f
Show file tree

Hide file tree

Showing 47 changed files with 2,428 additions and 1,771 deletions.
diff --git a/.babelrc b/.babelrc
@@ -10,11 +10,6 @@
   "plugins": [
     ["transform-object-rest-spread", {
       "useBuiltIns": true
-    }],
-    ["transform-runtime", {
-      "helpers": true,
-      "polyfill": true,
-      "regenerator": true
     }]
   ]
 }
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,82 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+[*]
+# Change these settings to your own preference
+indent_style = space
+indent_size = 4
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.feature]
+indent_style = space
+indent_size = 4
+
+[*.js]
+indent_style = space
+indent_size = 2
+
+[*.json]
+indent_style = space
+indent_size = 2
+
+[*.md]
+indent_style = space
+indent_size = 4
+trim_trailing_whitespace = false
+
+[*.neon]
+indent_style = space
+indent_size = 4
+
+[*.php]
+indent_style = space
+indent_size = 4
+
+[*.sh]
+indent_style = space
+indent_size = 4
+
+[*.{yaml,yml}]
+indent_style = space
+indent_size = 4
+trim_trailing_whitespace = false
+
+[.babelrc]
+indent_style = space
+indent_size = 2
+
+[.gitmodules]
+indent_style = tab
+indent_size = 4
+
+[.php_cs{,.dist}]
+indent_style = space
+indent_size = 4
+
+[composer.json]
+indent_style = space
+indent_size = 4
+
+[package.json]
+indent_style = space
+indent_size = 2
+
+[phpspec.yml{,.dist}]
+indent_style = space
+indent_size = 4
+
+[phpstan.neon]
+indent_style = space
+indent_size = 4
+
+[phpunit.xml{,.dist}]
+indent_style = space
+indent_size = 4
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,6 +1,13 @@
 module.exports = {
   extends: 'airbnb-base',
+  env: {
+    node: true,
+  },
   rules: {
+    'object-shorthand': ['error', 'always', {
+      avoidQuotes: true,
+      avoidExplicitReturnArrows: true,
+    }],
     'function-paren-newline': ['error', 'consistent'],
     'max-len': ['warn', 120, 2, {
       ignoreUrls: true,

diff --git a/UPGRADE-1.0.md b/UPGRADE-1.0.md
@@ -26,7 +26,7 @@
   {
         // Other registrered bundles
 
-	    if (in_array($this->getEnvironment(), ['prod']))
+        if (in_array($this->getEnvironment(), ['prod']))
         {
             $bundles[] = new \Symfony\Bundle\WebServerBundle\WebServerBundle();
         }

diff --git a/gulpfile.babel.js b/gulpfile.babel.js
@@ -27,7 +27,7 @@ const config = [
 
 export const buildAdmin = function buildAdmin() {
   return gulp.src('src/Sylius/Bundle/AdminBundle/gulpfile.babel.js', { read: false })
-    .pipe(chug({ args: config }));
+    .pipe(chug({ args: config, tasks: 'build' }));
 };
 buildAdmin.description = 'Build admin assets.';
 
@@ -39,7 +39,7 @@ watchAdmin.description = 'Watch admin asset sources and rebuild on changes.';
 
 export const buildShop = function buildShop() {
   return gulp.src('src/Sylius/Bundle/ShopBundle/gulpfile.babel.js', { read: false })
-    .pipe(chug({ args: config }));
+    .pipe(chug({ args: config, tasks: 'build' }));
 };
 buildShop.description = 'Build shop assets.';
 

diff --git a/package.json b/package.json
@@ -1,18 +1,23 @@
 {
   "dependencies": {
-    "babel-runtime": "^6.26.0",
+    "babel-polyfill": "^6.26.0",
     "jquery": "^3.2.0",
     "lightbox2": "^2.9.0",
     "semantic-ui-css": "^2.2.0"
   },
   "devDependencies": {
+    "babel-core": "^6.26.3",
+    "babel-plugin-external-helpers": "^6.22.0",
+    "babel-plugin-module-resolver": "^3.1.1",
     "babel-plugin-transform-object-rest-spread": "^6.26.0",
-    "babel-plugin-transform-runtime": "^6.23.0",
     "babel-preset-env": "^1.7.0",
     "babel-register": "^6.26.0",
+    "dedent": "^0.7.0",
     "eslint": "^4.19.1",
     "eslint-config-airbnb-base": "^12.1.0",
+    "eslint-import-resolver-babel-module": "^4.0.0",
     "eslint-plugin-import": "^2.11.0",
+    "fast-async": "^6.3.7",
     "gulp": "^4.0.0",
     "gulp-chug": "^0.5",
     "gulp-concat": "^2.6.0",
@@ -22,17 +27,22 @@
     "gulp-order": "^1.1.1",
     "gulp-sass": "^4.0.1",
     "gulp-sourcemaps": "^1.6.0",
-    "gulp-uglify": "^1.5.1",
     "gulp-uglifycss": "^1.0.5",
     "merge-stream": "^1.0.0",
+    "rollup": "^0.60.2",
+    "rollup-plugin-babel": "^3.0.4",
+    "rollup-plugin-commonjs": "^9.1.3",
+    "rollup-plugin-inject": "^2.0.0",
+    "rollup-plugin-node-resolve": "^3.3.0",
+    "rollup-plugin-uglify": "^4.0.0",
     "upath": "^1.1.0",
     "yargs": "^6.4.0"
   },
   "scripts": {
-    "build": "gulp",
-    "gulp": "gulp",
+    "build": "gulp build",
+    "gulp": "gulp build",
     "lint": "yarn lint:js",
-    "lint:js": "eslint gulpfile.babel.js src/Sylius/Bundle/AdminBundle/gulpfile.babel.js src/Sylius/Bundle/ShopBundle/gulpfile.babel.js"
+    "lint:js": "eslint gulpfile.babel.js src/Sylius/Bundle/AdminBundle/gulpfile.babel.js src/Sylius/Bundle/ShopBundle/gulpfile.babel.js src/Sylius/Bundle/UiBundle/Resources/private/js src/Sylius/Bundle/AdminBundle/Resources/private/js src/Sylius/Bundle/ShopBundle/Resources/private/js"
   },
   "repository": {
     "type": "git",

diff --git a/src/Sylius/Bundle/AdminBundle/Resources/private/.eslintrc.js b/src/Sylius/Bundle/AdminBundle/Resources/private/.eslintrc.js
@@ -0,0 +1,29 @@
+module.exports = {
+  extends: 'airbnb-base',
+  env: {
+    browser: true,
+  },
+  rules: {
+    'object-shorthand': ['error', 'always', {
+      avoidQuotes: true,
+      avoidExplicitReturnArrows: true,
+    }],
+    'function-paren-newline': ['error', 'consistent'],
+    'max-len': ['warn', 120, 2, {
+      ignoreUrls: true,
+      ignoreComments: false,
+      ignoreRegExpLiterals: true,
+      ignoreStrings: true,
+      ignoreTemplateLiterals: true,
+    }],
+  },
+  settings: {
+    'import/resolver': {
+      'babel-module': {
+        alias: {
+          'sylius/ui': './src/Sylius/Bundle/UiBundle/Resources/private/js',
+        },
+      },
+    },
+  },
+};
diff --git a/src/Sylius/Bundle/AdminBundle/Resources/private/js/app.js b/src/Sylius/Bundle/AdminBundle/Resources/private/js/app.js
@@ -7,77 +7,97 @@
  * file that was distributed with this source code.
  */
 
-(function($) {
-    $(document).ready(function () {
-        $('#sylius_product_variant_pricingCalculator').handlePrototypes({
-            'prototypePrefix': 'sylius_product_variant_pricingCalculator',
-            'containerSelector': '#sylius_calculator_container'
-        });
-
-        $('#sylius_customer_createUser').change(function () {
-            $('#user-form').toggle();
-        });
-
-        $('.sylius-autocomplete').autoComplete();
-
-        $('.product-select.ui.fluid.multiple.search.selection.dropdown').productAutoComplete();
-        $('div#attributeChoice > .ui.dropdown.search').productAttributes();
-
-        $('table thead th.sortable').on('click', function () {
-            window.location = $(this).find('a').attr('href');
-        });
-
-        $('.sylius-update-product-taxons').moveProduct($('.sylius-product-taxon-position'));
-        $('.sylius-update-product-variants').moveProductVariant($('.sylius-product-variant-position'));
-        $('.sylius-taxon-move-up').taxonMoveUp();
-        $('.sylius-taxon-move-down').taxonMoveDown();
-
-        $('#sylius_shipping_method_calculator').handlePrototypes({
-            'prototypePrefix': 'sylius_shipping_method_calculator_calculators',
-            'containerSelector': '.configuration'
-        });
-
-        $('#actions a[data-form-collection="add"]').on('click', function () {
-            setTimeout(function(){
-                $('select[name^="sylius_promotion[actions]"][name$="[type]"]').last().change();
-            }, 50);
-        });
-        $('#rules a[data-form-collection="add"]').on('click', function () {
-            setTimeout(function(){
-                $('select[name^="sylius_promotion[rules]"][name$="[type]"]').last().change();
-            }, 50);
-        });
-
-        $(document).on('collection-form-add', function () {
-            $.each($('.sylius-autocomplete'), function (index, element) {
-                if ($._data($(element).get(0), 'events') == undefined) {
-                    $(element).autoComplete();
-                }
-            });
-        });
-        $(document).on('collection-form-update', function () {
-            $.each($('.sylius-autocomplete'), function (index, element) {
-                if ($._data($(element).get(0), 'events') == undefined) {
-                    $(element).autoComplete();
-                }
-            });
-        });
-
-        $('.sylius-tabular-form').addTabErrors();
-        $('.ui.accordion').addAccordionErrors();
-        $('#sylius-product-taxonomy-tree').choiceTree('productTaxon', true, 1);
-
-        $(document).notification();
-        $(document).productSlugGenerator();
-        $(document).taxonSlugGenerator();
-
-        $(document).previewUploadedImage('#sylius_product_images');
-        $(document).previewUploadedImage('#sylius_taxon_images');
-
-        $('body').on('DOMNodeInserted', '[data-form-collection="item"]', function() {
-            if ($(this).find('.accordion').length > 0) {
-                $(this).find('.accordion').accordion();
-            }
-        });
+import 'semantic-ui-css/components/accordion';
+import $ from 'jquery';
+
+import 'sylius/ui/app';
+import 'sylius/ui/sylius-auto-complete';
+import 'sylius/ui/sylius-product-attributes';
+import 'sylius/ui/sylius-product-auto-complete';
+import 'sylius/ui/sylius-prototype-handler';
+
+import './sylius-compound-form-errors';
+import './sylius-lazy-choice-tree';
+import './sylius-move-product';
+import './sylius-move-product-variant';
+import './sylius-move-taxon';
+import './sylius-notification';
+import './sylius-product-images-preview';
+import './sylius-product-slug';
+import './sylius-taxon-slug';
+
+$(document).ready(() => {
+  $('#sylius_product_variant_pricingCalculator').handlePrototypes({
+    prototypePrefix: 'sylius_product_variant_pricingCalculator',
+    containerSelector: '#sylius_calculator_container',
+  });
+
+  $('#sylius_customer_createUser').change(() => {
+    $('#user-form').toggle();
+  });
+
+  $('.sylius-autocomplete').autoComplete();
+
+  $('.product-select.ui.fluid.multiple.search.selection.dropdown').productAutoComplete();
+  $('div#attributeChoice > .ui.dropdown.search').productAttributes();
+
+  $('table thead th.sortable').on('click', (event) => {
+    window.location = $(event.currentTarget).find('a').attr('href');
+  });
+
+  $('.sylius-update-product-taxons').moveProduct($('.sylius-product-taxon-position'));
+  $('.sylius-update-product-variants').moveProductVariant($('.sylius-product-variant-position'));
+  $('.sylius-taxon-move-up').taxonMoveUp();
+  $('.sylius-taxon-move-down').taxonMoveDown();
+
+  $('#sylius_shipping_method_calculator').handlePrototypes({
+    prototypePrefix: 'sylius_shipping_method_calculator_calculators',
+    containerSelector: '.configuration',
+  });
+
+  $('#actions a[data-form-collection="add"]').on('click', () => {
+    setTimeout(() => {
+      $('select[name^="sylius_promotion[actions]"][name$="[type]"]').last().change();
+    }, 50);
+  });
+  $('#rules a[data-form-collection="add"]').on('click', () => {
+    setTimeout(() => {
+      $('select[name^="sylius_promotion[rules]"][name$="[type]"]').last().change();
+    }, 50);
+  });
+
+  $(document).on('collection-form-add', () => {
+    $('.sylius-autocomplete').each((index, element) => {
+      if ($._data($(element).get(0), 'events') == undefined) {
+        $(element).autoComplete();
+      }
     });
-})(jQuery);
+  });
+  $(document).on('collection-form-update', () => {
+    $('.sylius-autocomplete').each((index, element) => {
+      if ($._data($(element).get(0), 'events') == undefined) {
+        $(element).autoComplete();
+      }
+    });
+  });
+
+  $('.sylius-tabular-form').addTabErrors();
+  $('.ui.accordion').addAccordionErrors();
+  $('#sylius-product-taxonomy-tree').choiceTree('productTaxon', true, 1);
+
+  $(document).notification();
+  $(document).productSlugGenerator();
+  $(document).taxonSlugGenerator();
+
+  $(document).previewUploadedImage('#sylius_product_images');
+  $(document).previewUploadedImage('#sylius_taxon_images');
+
+  $('body').on('DOMNodeInserted', '[data-form-collection="item"]', (event) => {
+    if ($(event.relatedNode).find('.accordion').length > 0) {
+      $(event.relatedNode).find('.accordion').accordion();
+    }
+  });
+});
+
+window.$ = $;
+window.jQuery = $;
diff --git a/src/Sylius/Bundle/AdminBundle/Resources/private/js/shim/shim-jquery.js b/src/Sylius/Bundle/AdminBundle/Resources/private/js/shim/shim-jquery.js
@@ -0,0 +1,4 @@
+import $ from 'jquery';
+
+window.$ = $;
+window.jQuery = $;
diff --git a/src/Sylius/Bundle/AdminBundle/Resources/private/js/shim/shim-polyfill.js b/src/Sylius/Bundle/AdminBundle/Resources/private/js/shim/shim-polyfill.js
@@ -0,0 +1 @@
+import 'babel-polyfill';