From bddb3c12f9a8ef3035c73ec02e11da6343277f82 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Serta=C3=A7=20Karahoda?= <skarahoda@sabanciuniv.edu>
Date: Wed, 28 Oct 2020 19:29:00 +0300
Subject: [PATCH] Reconfigure webpack for pollyfilling and tree shaking (#37)

---
 package-lock.json                  |  5 +++++
 package.json                       |  1 +
 src/commands/create.js             |  1 +
 src/commands/test.js               |  2 +-
 src/config/webpack.common.js       | 25 ++++++++++++++++---------
 src/config/webpack.prod.js         |  4 +---
 src/template/src/fixtures/index.js |  2 +-
 7 files changed, 26 insertions(+), 14 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e8fe31c..18abc3e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3769,6 +3769,11 @@
       "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
       "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
     },
+    "core-js": {
+      "version": "3.6.4",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.4.tgz",
+      "integrity": "sha512-4paDGScNgZP2IXXilaffL9X7968RuvwlkK3xWtZRVqgd8SYNiVKRJvkFd1aqqEuPfN7E68ZHEp9hDj6lHj4Hyw=="
+    },
     "core-js-compat": {
       "version": "3.6.4",
       "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.6.4.tgz",
diff --git a/package.json b/package.json
index 35727d4..f0cba93 100644
--- a/package.json
+++ b/package.json
@@ -38,6 +38,7 @@
     "chalk": "^2.3.1",
     "ci-info": "^2.0.0",
     "commander": "^2.14.1",
+    "core-js": "^3.6.4",
     "eslint": "^4.18.1",
     "eslint-loader": "^2.0.0",
     "fs-extra": "^5.0.0",
diff --git a/src/commands/create.js b/src/commands/create.js
index 648d18e..187f131 100644
--- a/src/commands/create.js
+++ b/src/commands/create.js
@@ -78,6 +78,7 @@ const createPackageJson = (root, { packageName, description, displayName, platfo
         name: packageName,
         version: "0.1.0",
         description,
+        sideEffects: false,
         scripts: {
             start: "zem start",
             build: "zem build",
diff --git a/src/commands/test.js b/src/commands/test.js
index f115974..6f5f2a2 100644
--- a/src/commands/test.js
+++ b/src/commands/test.js
@@ -10,7 +10,7 @@ module.exports = function (args) {
                     {
                         presets: [
                             [
-                                require.resolve("@babel/preset-env"),
+                                "@babel/preset-env",
                                 {
                                     targets: {
                                         node: "current"
diff --git a/src/config/webpack.common.js b/src/config/webpack.common.js
index 1505e05..7d9de04 100644
--- a/src/config/webpack.common.js
+++ b/src/config/webpack.common.js
@@ -17,22 +17,29 @@ const copies = {
 const { eslintConfig, main: entryPoint } = require(resolveExtensionPath("package.json"));
 const eslintEnabled = eslintConfig || fs.readdirSync(extensionPath).find(f => f.startsWith(".eslintrc"));
 const jsLoaders = [{
-    loader: require.resolve("babel-loader"),
+    loader: "babel-loader",
     options: {
         presets: [
-            [require.resolve("@babel/preset-env"), {
-                targets: {
-                    chrome: 45,
-                    safari: "9.1",
-                    firefox: 45
+            [
+                "@babel/preset-env",
+                {
+                    useBuiltIns: "usage",
+                    corejs: 3,
+                    modules: false, // Should be false to run tree shaking. See: https://webpack.js.org/guides/tree-shaking/
+                    targets: {
+                        chrome: 62,
+                        safari: 11,
+                        firefox: 59,
+                        edge: 15
+                    }
                 }
-            }]
+            ]
         ]
     }
 }];
 
 if (eslintEnabled) {
-    jsLoaders.push(require.resolve("eslint-loader"));
+    jsLoaders.push("eslint-loader");
 }
 
 module.exports = {
@@ -59,4 +66,4 @@ module.exports = {
         }),
         new ManifestBuilder(extensionPath, bundleName)
     ]
-};
\ No newline at end of file
+};
diff --git a/src/config/webpack.prod.js b/src/config/webpack.prod.js
index d77fd42..59f51fa 100644
--- a/src/config/webpack.prod.js
+++ b/src/config/webpack.prod.js
@@ -2,10 +2,8 @@ const merge = require("webpack-merge");
 const common = require("./webpack.common");
 
 module.exports = merge(common, {
+    mode: "production",
     output: {
         filename: "[name].[chunkhash:8].js"
-    },
-    optimization: {
-        minimize: true
     }
 });
\ No newline at end of file
diff --git a/src/template/src/fixtures/index.js b/src/template/src/fixtures/index.js
index c00a36b..5c7d771 100644
--- a/src/template/src/fixtures/index.js
+++ b/src/template/src/fixtures/index.js
@@ -6,7 +6,7 @@ import componentsData from "./components.json";
 import versionData from "./version.json";
 import { zeplin } from "../../package.json";
 
-const defaultOptions = zeplin.options.reduce((options, option) => {
+const defaultOptions = zeplin.options?.reduce((options, option) => {
     options[option.id] = option.default;
     return options;
 }, {});