Merge pull request #39 from edusperoni/worker-plugins

feat: Allow worker to use plugins

Author: Alexander Vakrilov

README.md

@@ -156,6 +156,26 @@ module.exports = env => {
 }
 ```
 
+8. **[Angular projects only]** Update your webpack.config.js to inherit the current `ngCompilerPlugin` to allow the use of shared code.
+
+``` javascript
+// webpack.config.js
+
+module.exports = env => {
+    // ...
+
+    const config = {
+        //...
+        plugins: [
+            new NativeScriptWorkerPlugin({
+                plugins: [ngCompilerPlugin]
+            }),
+            // ...
+        ]
+    }
+}
+```
+
 ## Web workers with/without webpack
 
 Please note that the way to spawn a Worker with webpack differs from the way described in the WWW Web Workers' specification (also followed by NativeScript).

demo-angular/app/app.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from "@angular/core";
 
 import { WorkerService } from "./worker.service";
+import { sharedFunction } from "./shared";
 
 @Component({ template: `` })
 export class AppComponent implements OnInit {
@@ -10,6 +11,7 @@ export class AppComponent implements OnInit {
     constructor(private workerService: WorkerService) { }
 
     ngOnInit() {
+        sharedFunction("app");
         this.tsWorker = this.workerService.initTsWorker();
         this.jsWorker = this.workerService.initJsWorker();
 

demo-angular/app/shared.ts

@@ -0,0 +1,4 @@
+
+export function sharedFunction(location: string) {
+    console.log("This code is shared between worker/app and ran from: " + location);
+}

demo-angular/app/workers/typescript.worker.ts

@@ -1,8 +1,10 @@
 import "globals";
+import { sharedFunction } from "../shared";
 
 const context: Worker = self as any;
 
 context.onmessage = msg => {
+    sharedFunction("worker");
     setTimeout(() => {
         console.log("Inside TS worker...");
         console.log(msg);

demo-angular/webpack.config.js

@@ -267,7 +267,9 @@ module.exports = env => {
             new nsWebpack.GenerateNativeScriptEntryPointsPlugin("bundle"),
             // For instructions on how to set up workers with webpack
             // check out https://github.com/nativescript/worker-loader
-            new NativeScriptWorkerPlugin(),
+            new NativeScriptWorkerPlugin({
+                plugins: [ngCompilerPlugin]
+            }),
             ngCompilerPlugin,
             // Does IPC communication with the {N} CLI to notify events when running in watch mode.
             new nsWebpack.WatchStateLoggerPlugin(),

src/NativeScriptWorkerPlugin.js

@@ -1,8 +1,11 @@
 const { resolve } = require("path");
 const { RawSource } = require("webpack-sources");
+const NATIVESCRIPT_WORKER_PLUGIN_SYMBOL = require("./symbol");
 
 exports.NativeScriptWorkerPlugin = (function () {
-    function NativeScriptWorkerPlugin() {
+    function NativeScriptWorkerPlugin(options) {
+        this.options = options || {};
+        this[NATIVESCRIPT_WORKER_PLUGIN_SYMBOL] = true;
     }
 
     NativeScriptWorkerPlugin.prototype.apply = function (compiler) {

src/index.js

@@ -6,6 +6,7 @@ const WebWorkerTemplatePlugin = require("webpack/lib/webworker/WebWorkerTemplate
 const NodeTargetPlugin = require("webpack/lib/node/NodeTargetPlugin");
 const SingleEntryPlugin = require("webpack/lib/SingleEntryPlugin");
 const optionsSchema = require("./options.json");
+const NATIVESCRIPT_WORKER_PLUGIN_SYMBOL = require("./symbol");
 
 const validateSchema = (schema, options, pluginName) => {
     if (options.inline) {
@@ -44,6 +45,8 @@ module.exports.pitch = function pitch(request) {
     this.cacheable(false);
     const callback = this.async();
     const options = loaderUtils.getOptions(this) || {};
+    const compilerOptions = this._compiler.options || {};
+    const pluginOptions = compilerOptions.plugins.find(p => p[NATIVESCRIPT_WORKER_PLUGIN_SYMBOL]).options;
 
     // handle calls to itself to avoid an infinite loop
     if (requests.indexOf(request) === -1) {
@@ -68,7 +71,18 @@ module.exports.pitch = function pitch(request) {
         namedChunkFilename: null,
     };
 
-    const workerCompiler = this._compilation.createChildCompiler("worker", outputOptions);
+    const plugins = (pluginOptions.plugins || []).map(plugin => {
+        if (typeof plugin !== 'string') {
+            return plugin;
+        }
+        const found = compilerOptions.plugins.find(p => p.constructor.name === plugin);
+        if (!found) {
+            console.warn(`Warning (worker-plugin): Plugin "${plugin}" is not found.`);
+        }
+        return found;
+    });
+
+    const workerCompiler = this._compilation.createChildCompiler("worker", outputOptions, plugins);
     new WebWorkerTemplatePlugin(outputOptions).apply(workerCompiler);
     if (this.target !== "webworker" && this.target !== "web") {
         new NodeTargetPlugin().apply(workerCompiler);

src/symbol.js

@@ -0,0 +1,3 @@
+
+const NATIVESCRIPT_WORKER_PLUGIN_SYMBOL = Symbol('NATIVESCRIPT_WORKER_PLUGIN_SYMBOL');
+module.exports = NATIVESCRIPT_WORKER_PLUGIN_SYMBOL;