打字稿在工作代码上引发错误

Question

I'm implementing Typescript into an example project to practice the use of webpack, ES6, npm...

I have loaders 'awesome-typescript-loader', 'babel-loader' which are functioning fine as the code is being bundled and is running.

The problem is that when i test something like this -

document.getElementById('test-id').innerHTML = 'asdf';

I get an error in the browser console.

However, the code is working, and the ID i am specifying is having that 'asdf' string injected.

I have tried alternate loader 'ts-loader', using querySelector() instead of getElementById() ... also assigning the element to a variable, then trying to set the .innerHTML , but to no avail.

Answer 1

The resolution to this problem, as casraf guessed, was that the script was running twice, once before + once after the DOM had been loaded.

In this case i was using html-webpack-plugin to handle injecting script links, and still had a hardcoded copy in my index.html. It was solved by removing the hardcoded link.