WebStorm (v2.3.1): Live reload after file change (html) does not work. SyntaxError: Unexpected token < in JSON at position 0

Question

Initial seed, nothing has been changed.

Windows 7, npm 4.0.1, node v6.8.1, TypeScript 2.0.10

That's the Chrome Console (Screen shot):

VM661:1 Uncaught SyntaxError: 
Unexpected token < in JSON at position 0
at JSON.parse (<anonymous>)
at http://localhost:5555/app/system-config.js:1:20
(anonymous function) @ system-config.ts:2

At reloading-time the '<%= SYSTEM_CONFIG_DEV %>' cannot be interpreted, whatever the problem is, it is time or order-related.

The message Unexpected token < stands for < of '<%= SYSTEM_CONFIG_DEV %>'

WebStorm TypeScript settings:

WebStorm "safe-write" activated:

Further investigations (23.12.2017):

We have still this problem, disabling of TypeScript Compiler does not solve the problem.

The starting point of the problem is here (src/client/app/system-config.ts):

System.config(JSON.parse('<%= SYSTEM_CONFIG_DEV %>'));

This template beginning with <%= ... was not being evaluated on reload after html change:

'<%= SYSTEM_CONFIG_DEV %>'

What kind of templating is that? EJS ? Where is this dependency in the seed? I've 2 suspicions:

1) Express server on Windows has problems with reloading of EJS templates ?

2) EJS will not be evaluated because of injection order of js-libraries ?

Answer 1

I've modified start.deving.ts und now it works in windows too:

gulp.task('watch.while_deving', function () {
  watchAppFiles('**/!(*.ts)', (e: any, done: any) =>
    runSequence('build.assets.dev', 'build.html_css', 'build.js.dev', 'build.index.dev', () => { notifyLiveReload(e); done(); }));
  watchAppFiles('**/(*.ts)', (e: any, done: any) =>
    runSequence('build.js.dev', 'build.index.dev', () => {
      notifyLiveReload(e);
      runSequence('build.js.test', 'karma.run.with_coverage', done);
    }));
});

try it: npm run start.deving