@teamleader/i18n - npm Package Compare versions

Comparing version 2.0.3 to 2.1.0

CHANGELOG.md

@@ -0,1 +1,7 @@
+## [2.1.0] - 2019-03-08
+
+### Changed
+
+- Locale data from `react-intl` is now loaded with a dynamic import (`import()`). So the data will be loaded asynchronously now, instead of putting all the locale data into your bundle. This makes your bundle much smaller.
+
 ## [2.0.3] - 2019-02-27
@@ -18,2 +24,3 @@
 ### Changed
+
 - Rename 'language' prop to 'locale'. (added in [#4](https://github.com/teamleadercrm/i18n/pull/4))
@@ -26,2 +33,3 @@ - Default locale is now 'en-GB' instead of 'en'. (added in [#4](https://github.com/teamleadercrm/i18n/pull/4))
 ### Added
+
 - Flow types for `withI18n`. ([@nickwaelkens](https://github.com/nickwaelkens) in [#2](https://github.com/teamleadercrm/i18n/pull/2))
@@ -28,0 +36,0 @@

lib/index.js

@@ -26,4 +26,2 @@ "use strict";
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -139,8 +137,12 @@
                 locale = this.getUserLocale();
-                localeData = this.getAllLocaleData();
+                _context.next = 3;
+                return this.getLocaleData(locale);
+
+              case 3:
+                localeData = _context.sent;
                 (0, _reactIntl.addLocaleData)(localeData);
-                _context.next = 5;
+                _context.next = 7;
                 return this.fetchTranslations(locale);
 
-              case 5:
+              case 7:
                 translations = _context.sent;
@@ -217,3 +219,3 @@ component = React.createElement(_reactIntl.IntlProvider, {
 
-              case 8:
+              case 10:
               case "end":
@@ -310,20 +312,43 @@ return _context.stop();
   }, {
-    key: "getAllLocaleData",
-    value: function getAllLocaleData() {
-      var _this3 = this;
+    key: "getLocaleData",
+    value: function () {
+      var _getLocaleData = _asyncToGenerator(
+      /*#__PURE__*/
+      regeneratorRuntime.mark(function _callee3(locale) {
+        var language, module, localeData;
+        return regeneratorRuntime.wrap(function _callee3$(_context3) {
+          while (1) {
+            switch (_context3.prev = _context3.next) {
+              case 0:
+                language = this.localeToLanguage(locale);
+                _context3.next = 3;
+                return import("react-intl/locale-data/".concat(language));
 
-      var languages = Object.keys(_supportedLocales.default.reduce(function (languages, locale) {
-        return _objectSpread({}, languages, _defineProperty({}, _this3.localeToLanguage(locale), true));
-      }, {}));
-      var localeData = languages.map(function (language) {
-        return require("react-intl/locale-data/".concat(language));
-      });
-      localeData.push({
-        locale: 'tlh',
-        parentLocale: 'en'
-      });
-      return localeData.reduce(function (allLocaleData, localeData) {
-        return allLocaleData.concat(localeData);
-      }, []);
-    }
+              case 3:
+                module = _context3.sent;
+                localeData = module.default;
+
+                if (locale === 'tlh-KL') {
+                  localeData.push({
+                    locale: 'tlh',
+                    parentLocale: 'en'
+                  });
+                }
+
+                return _context3.abrupt("return", localeData);
+
+              case 7:
+              case "end":
+                return _context3.stop();
+            }
+          }
+        }, _callee3, this);
+      }));
+
+      function getLocaleData(_x2) {
+        return _getLocaleData.apply(this, arguments);
+      }
+
+      return getLocaleData;
+    }()
   }, {
@@ -330,0 +355,0 @@ key: "render",

package.json

 {
   "name": "@teamleader/i18n",
-  "version": "2.0.3",
+  "version": "2.1.0",
   "description": "Teamleader i18n implementation",
@@ -27,2 +27,3 @@ "author": "Teamleader <[e-mail]>",
     "@babel/plugin-proposal-object-rest-spread": "^7.3.4",
+    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/preset-env": "^7.3.4",
@@ -29,0 +30,0 @@ "@babel/preset-flow": "^7.0.0",

Fixed alerts

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

21468

increased by2.26%

Lines of code

316

increased by6.4%

Number of low supply chain risk alerts

1

decreased by-50%

Worsened metrics

Dev dependency count

13

increased by8.33%

No dependency changes