Use Svelte NodeGUI Preprocessor

Author: shirakaba

demo/package-lock.json

@@ -17,6 +17,7 @@
   },
   "devDependencies": {
     "@nodegui/packer": "^1.4.1",
+    "@nodegui/svelte-nodegui-preprocessor": "^0.1.0",
     "@tsconfig/svelte": "^1.0.10",
     "@types/node": "^14.14.31",
     "clean-webpack-plugin": "^3.0.0",
@@ -25,7 +26,6 @@
     "native-addon-loader": "^2.0.1",
     "svelte": "^3.32.1",
     "svelte-loader": "^2.13.6",
-    "svelte-native-preprocessor": "~0.2.0",
     "svelte-preprocess": "^4.6.5",
     "ts-loader": "^8.0.17",
     "typescript": "^4.2.2",

demo/package.json

@@ -11,7 +11,6 @@
     });
 </script>
 
-<svelte:options namespace="foreign" />
 <window bind:this={win} windowTitle="Hello World">
     <view id="container" style="background-color: '#41444A';">
         <text style="color: white;">Some text with actual children</text>

demo/src/App.svelte

@@ -2,8 +2,8 @@ const path = require("path");
 const webpack = require("webpack");
 const ForkTsCheckerWebpackPlugin = require("fork-ts-checker-webpack-plugin");
 const { CleanWebpackPlugin } = require("clean-webpack-plugin");
-const svelteNativePreprocessor = require("svelte-native-preprocessor");
-const sveltePreprocess = require("svelte-preprocess");
+const SvelteNodeGUIPreprocessor = require("@nodegui/svelte-nodegui-preprocessor");
+const SveltePreprocess = require("svelte-preprocess");
 
 module.exports = (env, argv) => {
     const config = {
@@ -67,8 +67,8 @@ module.exports = (env, argv) => {
                             loader: 'svelte-loader',
                             options: {
                                 preprocess: {
-                                    ...sveltePreprocess(),
-                                    ...svelteNativePreprocessor(),
+                                    ...SveltePreprocess(),
+                                    ...SvelteNodeGUIPreprocessor(),
                                 },
                             }
                         }