hmr example

fuse-box · Feb 6, 2020 · 1eaa8e9 · 1eaa8e9
1 parent bbebc58
commit 1eaa8e9
Show file tree

Hide file tree

Showing 12 changed files with 2,170 additions and 0 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/hmr-plugin-example/fuse.ts b/hmr-plugin-example/fuse.ts
@@ -0,0 +1,19 @@
+import { fusebox } from 'fuse-box';
+import * as path from 'path';
+const fuse = fusebox({
+  cache: true,
+  devServer: true,
+  entry: 'src/index.ts',
+  hmr : { plugin : "src/hmr.ts"},
+  target: 'browser',
+  webIndex: {
+    template: 'src/index.html',
+  },
+});
+
+fuse.runDev({
+  bundles: {
+    app: 'app.js',
+    distRoot: path.join(__dirname, 'dist'),
+  },
+});
diff --git a/hmr-plugin-example/package.json b/hmr-plugin-example/package.json
@@ -0,0 +1,15 @@
+{
+  "author": "",
+  "description": "",
+  "devDependencies": {
+    "fuse-box": "4.0.0-alpha.302",
+    "node-sass": "^4.13.1"
+  },
+  "license": "ISC",
+  "main": "index.js",
+  "name": "hmr-plugin-example",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "version": "1.0.0"
+}
diff --git a/hmr-plugin-example/src/components/BarComponent.ts b/hmr-plugin-example/src/components/BarComponent.ts
@@ -0,0 +1,3 @@
+const BarComponent = "BarComponentString"
+export default BarComponent;
+
diff --git a/hmr-plugin-example/src/components/FooComponent.ts b/hmr-plugin-example/src/components/FooComponent.ts
@@ -0,0 +1,3 @@
+const FooComponentString = "FooComponentString"
+export default FooComponentString;
+
diff --git a/hmr-plugin-example/src/hmr.ts b/hmr-plugin-example/src/hmr.ts
@@ -0,0 +1,16 @@
+import { HMRHelper, HMRPayload } from "fuse-box/types/hmr";
+export default function(payload: HMRPayload, helper: HMRHelper) {
+  const { updates } = payload;
+  if (helper.isStylesheeetUpdate) {
+    helper.flushModules(updates);
+
+    helper.updateModules()
+
+    helper.callModules(updates);
+  } else {
+    helper.flushAll();
+    helper.updateModules()
+
+    helper.callEntries();
+  }
+}
diff --git a/hmr-plugin-example/src/index.html b/hmr-plugin-example/src/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
+    <meta content="ie=edge" http-equiv="X-UA-Compatible" />
+    <title></title>
+
+  </head>
+  <body>
+      <div id="root"></div>
+    $bundles
+  </body>
+</html>
diff --git a/hmr-plugin-example/src/index.scss b/hmr-plugin-example/src/index.scss
@@ -0,0 +1,6 @@
+@import "other";
+
+#root {
+  height: 500px;
+  width: 100%;
+}
diff --git a/hmr-plugin-example/src/index.ts b/hmr-plugin-example/src/index.ts
@@ -0,0 +1,14 @@
+import "./index.scss";
+
+async function main(){
+    const foo = await import("./components/FooComponent")
+    const bar = await import("./components/BarComponent");
+
+    document.getElementById("root").innerHTML = `
+        <div class="foo">${foo.default}</div>
+        <div class="bar">${bar.default}</div>
+    `
+}
+
+
+main();
diff --git a/hmr-plugin-example/src/other.scss b/hmr-plugin-example/src/other.scss
@@ -0,0 +1,12 @@
+#root {
+  background-color: white;
+  border: 1px solid hotpink;
+  padding: 20px;
+}
+
+.foo {
+    color:red;
+}
+.bar {
+    color: green;
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		const BarComponent = "BarComponentString"
		export default BarComponent;
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		const FooComponentString = "FooComponentString"
		export default FooComponentString;