Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Chrome dev tools lose syntax highlighting for TypeScript

I'm not sure if there if a way around this, or if maybe there is an issue when using mapped TypeScript files, but in many cases (larger files), I seem to lose the syntax highlighting.. enter image description here

As can be seen on the above image, it is ok until line 102, and from then on the rest of the file is just in red.

The above is from an Ionic 2 / Angular 2 project.

Appears to happen after the use of backtick string (but not always after the use of these)

It is not the end of the world, but the highlighting does make it easier to read. Anyone else experience this, and perhaps know a work around?

like image 994
peterc Avatar asked Mar 04 '17 23:03

peterc


People also ask

How do I fix dev tools in Chrome?

# Open the Issues tab Open DevTools. Click the Go to Issues button in the yellow warning bar. Alternatively, select Issues from the More tools menu. Once you're on the Issues tab, click the Reload page button if necessary.

How do I use typescript in Chrome?

You cannot use Typescript in Chrome. Typescript is superset of JS and you must first compile . TS file to . JS file.

Can I edit JavaScript in Chrome DevTools?

Edit JavaScript in Google Chrome Google Chrome provides the most efficient and excellent way to make changes in JavaScript code. We can also associate a folder with the Google Chrome Developer tool's workspace.


1 Answers

experiencing this problem all the time working with TS sourcemaps. that's chromium engine trouble, there is also bug report about this problem (link to report) I gave up for this and using oldschool string concatenation.

like image 166
readysteady Avatar answered Oct 16 '22 05:10

readysteady