@cocreate/lazy-loader 1.3.12 → 1.3.14

package/src/index.js

@@ -1,61 +1,61 @@
-import observer from '@cocreate/observer';
-
-function listen(callback, selector) {
-
-    function observerCallback({ target }) {
-        // let isInit = target.querySelector(selector)
-        // if (isInit) {
-            callback()
-            // console.log('lazyloaded', selector)
-            observer.uninit(observerCallback)
-        // }
-    }
-
-    observer.init({
-        name: 'lazyloadObserver',
-        observe: ['childList'],
-        target: selector,
-        callback: observerCallback
-    })
-
-    let selectorAttributes  = [];
-    let attributes = selector.split(",")
-    for (let attribute of attributes){
-        let attr = attribute.trim()
-        if (attr.startsWith("[")) {
-            let pos = attr.indexOf("*")
-            if (pos == -1)
-                pos = attr.indexOf("=")
-            if (pos !== -1) {
-                attr = attr.slice(1, pos)
-            } else {
-                attr = attr.slice(1, -1)
-            }
-            selectorAttributes.push(attr)
-        }
-
-    }
-    if (selectorAttributes.length > 0)
-        observer.init({ 
-            name: 'lazyloadAttributeObserver', 
-            observe: ['attributes'],
-            attributeName: selectorAttributes,
-            target: selector,
-            callback: observerCallback
-        });
-    
-}
-
-export async function lazyLoad(name, selector, callback) {
-    if (document.querySelector(selector))
-        await dependency(name, await callback())
-    else
-        listen(callback, selector)
-}
-
-export async function dependency(name, promise) {
-    let component = await promise;
-    Object.assign(window.CoCreate, {
-        [name]: component.default
-    });
+import observer from '@cocreate/observer';
+
+function listen(callback, selector) {
+
+    function observerCallback({ target }) {
+        // let isInit = target.querySelector(selector)
+        // if (isInit) {
+            callback()
+            // console.log('lazyloaded', selector)
+            observer.uninit(observerCallback)
+        // }
+    }
+
+    observer.init({
+        name: 'lazyloadObserver',
+        observe: ['childList'],
+        target: selector,
+        callback: observerCallback
+    })
+
+    let selectorAttributes  = [];
+    let attributes = selector.split(",")
+    for (let attribute of attributes){
+        let attr = attribute.trim()
+        if (attr.startsWith("[")) {
+            let pos = attr.indexOf("*")
+            if (pos == -1)
+                pos = attr.indexOf("=")
+            if (pos !== -1) {
+                attr = attr.slice(1, pos)
+            } else {
+                attr = attr.slice(1, -1)
+            }
+            selectorAttributes.push(attr)
+        }
+
+    }
+    if (selectorAttributes.length > 0)
+        observer.init({ 
+            name: 'lazyloadAttributeObserver', 
+            observe: ['attributes'],
+            attributeName: selectorAttributes,
+            target: selector,
+            callback: observerCallback
+        });
+    
+}
+
+export async function lazyLoad(name, selector, callback) {
+    if (document.querySelector(selector))
+        await dependency(name, await callback())
+    else
+        listen(callback, selector)
+}
+
+export async function dependency(name, promise) {
+    let component = await promise;
+    Object.assign(window.CoCreate, {
+        [name]: component.default
+    });
 }

package/webpack.config.js

@@ -1,84 +1,84 @@
-const path = require("path")
-const TerserPlugin = require("terser-webpack-plugin")
-const MiniCssExtractPlugin = require("mini-css-extract-plugin")
-let isProduction = process.env.NODE_ENV === "production"
-const { CleanWebpackPlugin } = require("clean-webpack-plugin")
-
-module.exports = {
-  entry: {
-    "CoCreate-lazy-loader": "./src/index.js",
-  },
-  output: {
-    path: path.resolve(__dirname, "dist"),
-    filename: isProduction ? "[name].min.js" : "[name].js",
-    libraryTarget: "umd",
-    libraryExport: "default",
-    library: ["CoCreate", "lazy-loader"],
-    globalObject: "this",
-  },
-
-  plugins: [
-    new CleanWebpackPlugin(),
-    new MiniCssExtractPlugin({
-      filename: "[name].css",
-    }),
-  ],
-  // Default mode for Webpack is production.
-  // Depending on mode Webpack will apply different things
-  // on final bundle. For now we don't need production's JavaScript
-  // minifying and other thing so let's set mode to development
-  mode: isProduction ? "production" : "development",
-  module: {
-    rules: [
-      {
-        test: /.js$/,
-        exclude: /(node_modules)/,
-        use: {
-          loader: "babel-loader",
-          options: {
-            plugins: ["@babel/plugin-transform-modules-commonjs"],
-          },
-        },
-      },
-      {
-        test: /.css$/i,
-        use: [
-          { loader: "style-loader", options: { injectType: "linkTag" } },
-          "file-loader",
-        ],
-      },
-    ],
-  },
-
-  // add source map
-  ...(isProduction ? {} : { devtool: "eval-source-map" }),
-
-  optimization: {
-    minimize: true,
-    minimizer: [
-      new TerserPlugin({
-        extractComments: true,
-        // cache: true,
-        parallel: true,
-        // sourceMap: true, // Must be set to true if using source-maps in production
-        terserOptions: {
-          // https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions
-          // extractComments: 'all',
-          compress: {
-            drop_console: true,
-          },
-        },
-      }),
-    ],
-    splitChunks: {
-      chunks: "all",
-      minSize: 200,
-      // maxSize: 99999,
-      //minChunks: 1,
-
-      cacheGroups: {
-        defaultVendors: false,
-      },
-    },
-  },
-}
+const path = require("path")
+const TerserPlugin = require("terser-webpack-plugin")
+const MiniCssExtractPlugin = require("mini-css-extract-plugin")
+let isProduction = process.env.NODE_ENV === "production"
+const { CleanWebpackPlugin } = require("clean-webpack-plugin")
+
+module.exports = {
+  entry: {
+    "CoCreate-lazy-loader": "./src/index.js",
+  },
+  output: {
+    path: path.resolve(__dirname, "dist"),
+    filename: isProduction ? "[name].min.js" : "[name].js",
+    libraryTarget: "umd",
+    libraryExport: "default",
+    library: ["CoCreate", "lazy-loader"],
+    globalObject: "this",
+  },
+
+  plugins: [
+    new CleanWebpackPlugin(),
+    new MiniCssExtractPlugin({
+      filename: "[name].css",
+    }),
+  ],
+  // Default mode for Webpack is production.
+  // Depending on mode Webpack will apply different things
+  // on final bundle. For now we don't need production's JavaScript
+  // minifying and other thing so let's set mode to development
+  mode: isProduction ? "production" : "development",
+  module: {
+    rules: [
+      {
+        test: /.js$/,
+        exclude: /(node_modules)/,
+        use: {
+          loader: "babel-loader",
+          options: {
+            plugins: ["@babel/plugin-transform-modules-commonjs"],
+          },
+        },
+      },
+      {
+        test: /.css$/i,
+        use: [
+          { loader: "style-loader", options: { injectType: "linkTag" } },
+          "file-loader",
+        ],
+      },
+    ],
+  },
+
+  // add source map
+  ...(isProduction ? {} : { devtool: "eval-source-map" }),
+
+  optimization: {
+    minimize: true,
+    minimizer: [
+      new TerserPlugin({
+        extractComments: true,
+        // cache: true,
+        parallel: true,
+        // sourceMap: true, // Must be set to true if using source-maps in production
+        terserOptions: {
+          // https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions
+          // extractComments: 'all',
+          compress: {
+            drop_console: true,
+          },
+        },
+      }),
+    ],
+    splitChunks: {
+      chunks: "all",
+      minSize: 200,
+      // maxSize: 99999,
+      //minChunks: 1,
+
+      cacheGroups: {
+        defaultVendors: false,
+      },
+    },
+  },
+}