problem with ionic

[Arpapiemonte]

Hi, I'm trying to use it with ionic. I created the 3 files you suggested, but I have this error: Module not found: Error: Can't resolve 'file-loader'

Can you help me? Thanks

[zlepper]

All this is assuming you are using Webpack, which has a special loader called the "file-loader", which allows you to get a file path, and not the content itself, this in turn is then used to start a new worker.

[zlepper]

But the really important thing here is not how we get the file, you can hard-code that and it would probably still work, it's this part: https://github.com/zlepper/typescript-webworker/blob/master/tsconfig.json#L7-L9 it makes typescript accept the high level web-worker commands.

[Arpapiemonte]

Thanks you very much for the rapid answer. Sorry I'm new to ionic and developing app in general. In any case I tried to insert in my 'tsconfig.json' file those lines but it doesn't work...

[zlepper]

That will not fix the issue you listed above. I have never done anything with Ionic, so I sadly can't help much there. Instead you would likely have to do something like this:

tsconfig.json:

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "sourceMap": true,
    "lib": [
      "webworker",
      "es6",
      "scripthost"
    ]
  },
  "exclude": [
    "node_modules"
  ]
}

index.ts:

const worker = new Worker("path/to/worker.js")

worker.postMessage("foo")

worker.ts:

addEventListener('message', (message) => {
    console.log('in webworker', message);
});

And then you will have to transpile your worker manually by calling out to `

[Arpapiemonte]

Well, in reality if I change my tsconfig.json like you suggest, I have immediately an error... so I am forced to leave the original.

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [
      "dom",
      "es2015"
    ],
    "module": "es2015", 
    "moduleResolution": "node",
    "sourceMap": true,
    "target": "es5"
  },
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ],
  "compileOnSave": false,
  "atom": {
    "rewriteTsconfig": false
  }
}

If I try to use worker with: const worker = new Worker("path/to/worker.js") I have a stupid error: Failed to load resource: net::ERR_FILE_NOT_FOUND like if the path was wrong (BUT IT'S CORRETT!)

[zlepper]

Sadly I don't know anything about how Ionic loads resources. The path you are loading should be the output path of the file, however ionic does that.