Add code splitting; split main and demo bundle

407858a3 · Reiter, Christoph · 1cd0dc33 · 407858a3 · 407858a3 · 407858a3
Commit 407858a3 authored 5 years ago by Reiter, Christoph
--- a/packages/language-select/assets/index.html
+++ b/packages/language-select/assets/index.html
@@ -2,7 +2,7 @@
 <html>
 <head>
    <meta charset="UTF-8">
-    <script type="module" src="bundle.js"></script>
+    <script type="module" src="vpu-language-select-demo.js"></script>
    <style>
    body {
        font-family: sans;

--- a/packages/language-select/package.json
+++ b/packages/language-select/package.json
 {
  "name": "vpu-language-select",
  "version": "1.0.0",
-  "main": "src/index.js",
+  "main": "src/vpu-language-select.js",
  "devDependencies": {
    "karma": "^4.2.0",
    "karma-chai": "^0.1.0",
@@ -20,6 +20,7 @@
    "rollup-plugin-terser": "^5.1.1",
    "rollup-plugin-json": "^4.0.0",
    "rollup-plugin-multi-entry": "^2.1.0",
+    "rollup-plugin-delete": "^1.1.0",
    "i18next-scanner": "^2.10.2",
    "vpu-common": "file:./vendor/common"
  },

--- a/packages/language-select/rollup.config.js
+++ b/packages/language-select/rollup.config.js
@@ -7,18 +7,25 @@ import json from 'rollup-plugin-json';
 import serve from 'rollup-plugin-serve';
 import multiEntry from 'rollup-plugin-multi-entry';
 import consts from 'rollup-plugin-consts';
+import del from 'rollup-plugin-delete';
 const build = (typeof process.env.BUILD !== 'undefined') ? process.env.BUILD : 'local';
 console.log("build: " + build);
 export default {
-    input: (build != 'test') ? 'src/demo.js' : 'test/**/*.js',
+    input: (build != 'test') ? ['src/vpu-language-select.js', 'src/vpu-language-select-demo.js'] : 'test/**/*.js',
    output: {
-        file: 'dist/bundle.js',
+        dir: 'dist',
-        format: 'esm'
+        entryFileNames: '[name].js',
+        chunkFileNames: 'shared/[name].[hash].[format].js',
+        format: 'esm',
+        sourcemap: true
    },
    plugins: [
-        multiEntry(),
+        del({
+            targets: 'dist/*'
+        }),
+        (build == 'test') ? multiEntry() : false,
        consts({
            environment: build,
        }),

--- a/packages/language-select/src/demo.js
+++ b/packages/language-select/src/demo.js
-import {html, LitElement} from 'lit-element';
+import './vpu-language-select-demo.js';
-import './language-select.js';
\ No newline at end of file
-import * as commonUtils from 'vpu-common/utils';
-class LanguageSelectDemo extends LitElement {
-    constructor() {
-        super();
-        this.lang = 'de';
-        this.handleChange =  this.handleChange.bind(this);
-    }
-    static get properties() {
-        return {
-            lang: {type: String},
-        };
-    }
-    handleChange(e) {
-        this.lang = e.detail.lang;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        window.addEventListener('vpu-language-changed', this.handleChange);
-    }
-    disconnectedCallback() {
-        window.removeEventListener('vpu-language-changed', this.handleChange);
-        super.disconnectedCallback();
-    }
-    render() {
-        return html`${this.lang}`;
-    }
-}
-commonUtils.defineCustomElement('vpu-language-select-demo', LanguageSelectDemo);
--- a/packages/language-select/src/index.js
+++ b/packages/language-select/src/index.js
-import './language-select.js';
--- a/packages/language-select/src/vpu-language-select-demo.js
+++ b/packages/language-select/src/vpu-language-select-demo.js
+import {html, LitElement} from 'lit-element';
+import './vpu-language-select.js';
+import * as commonUtils from 'vpu-common/utils';
+class LanguageSelectDemo extends LitElement {
+    constructor() {
+        super();
+        this.lang = 'de';
+        this.handleChange =  this.handleChange.bind(this);
+    }
+    static get properties() {
+        return {
+            lang: {type: String},
+        };
+    }
+    handleChange(e) {
+        this.lang = e.detail.lang;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        window.addEventListener('vpu-language-changed', this.handleChange);
+    }
+    disconnectedCallback() {
+        window.removeEventListener('vpu-language-changed', this.handleChange);
+        super.disconnectedCallback();
+    }
+    render() {
+        return html`${this.lang}`;
+    }
+}
+commonUtils.defineCustomElement('vpu-language-select-demo', LanguageSelectDemo);
--- a/packages/language-select/src/language-select.js
+++ b/packages/language-select/src/language-select.js
--- a/packages/language-select/test/unit.js
+++ b/packages/language-select/test/unit.js
-import '../src/language-select.js';
+import '../src/vpu-language-select.js';
 import '../src/demo.js';
 describe('vpu-language-select basics', () => {