make @ts-ignore available when using {/* @ts-ignore */}.

sottar commented 5 years ago

Search Terms

@ts-ignore annotation

Suggestion

Hi, I apologize if it is already discussed. However, I believe we need this feature for @ts-ignore. Currently @ts-ignore only mutes the errors only using with // @ts-ignore. I believe we also need to make @ts-ignore available when using {/* @ts-ignore */}.

I've already founded this issue. It's a similar issue but not the same and I think this is easier to implement.

I think this feature only need to change this code. https://github.com/Microsoft/TypeScript/blob/master/src/compiler/program.ts#L2

Use Cases

I'd like to use this in the html structures in the TSX file.

Examples

This is implementation for amp-script. We have to use onclick instead of onClick and it's not supported for now.

const App = () => {
  return (
    <div>
      ...
      {/* @ts-ignore */}
      <button onclick={() => setCount(count + 1)}>Click me</button> // this line should be ignored
      ...
    </div>
  );
}

Checklist

My suggestion meets these guidelines:

[x] This wouldn't be a breaking change in existing TypeScript/JavaScript code
[ ] This wouldn't change the runtime behavior of existing JavaScript code
[x] This could be implemented without emitting different JS based on the types of the expressions
[x] This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, etc.)
[x] This feature would agree with the rest of TypeScript's Design Goals.

yanlee26 commented 5 years ago

waiting feedback asap.

Mathijs003 commented 4 years ago

use this for now :

{/*
 // @ts-ignore*/}

tahv0 commented 4 years ago

use this for now :
{/*
 // @ts-ignore*/}

Parsing error: '...' expected

maw commented 4 years ago

I wasn't able to get the workarounds shown in this and other issues (https://github.com/microsoft/TypeScript/issues/27552, https://github.com/microsoft/TypeScript/issues/37738) to work.

I started with code that looks a bit like this

const Foo = () => {
    const thing = mightReturnNull();

    return (
        <div>
            <SomeComponent someProp={thing}></SomeComponent> 👈 tsc tells me off here
        </div>
    );
};

and turned it into this

const Foo = () => {
    const thing = mightReturnNull();

    // @ts-ignore
    const workaround: NonNullable<string> = thing;

    return (
        <div>
            <SomeComponent someProp={workaround}></SomeComponent>
        </div>
    );
};

I think this is reasonably clean and that the general idea likely applies more broadly.

(And, no, in the real, non-simplified code in question I'm not being quite so cavalier shuffling nulls around 😆 )

yishengjiang99 commented 3 years ago

one of those did the trick...

cmdcolin commented 3 years ago

I may be misunderstanding some simpler approach but I had trouble ts-ignore'ing a single prop on a tag, so I made the tag single lined with a prettier-ignore and then added a ts-ignore to that

Example

{/* prettier-ignore */
/* @ts-ignore  */}
<DataGrid propThatGivesTsError super={long} list={of} other={props} that={would} otherwise={take} multiple={lines} />

zhouzi commented 3 years ago

Here's how I was able to work around this issue:

<div>
  {
    // @ts-ignore
    <App />
  }
</div>

microsoft / TypeScript