Closed wxiaoguang closed 2 years ago
I think you should be able to do something like:
<script type="application/javascript" type="module">
/* eslint-disable */
// Your code
/* eslint-enable */
</script>
It doesn't work because the syntax inside the tag is invalid JavaScript code window.myGlobal.var = {{.MyData}}
Before the comment /* eslint-disable */
takes effect, the parser reports syntax error first.
Please refer to Linting templates
I have read it. But there are a lot of template engines, not only PHP.
And // <?= "\n mydata = " . json_encode($var) . ";" ?>
is quite ugly, and sometimes it's not feasible in other template engines.
If the whole <script>
tag could be disabled from linting, then the code can be simple and clear. Maybe something like:
<!-- eslint-disable -->
<script type="module">
window.myGlobal.var = {{.MyData}}; // here is invalid JS syntax, but it's rendered by backend template engine correctly.
</script>
Is it feasible?
I think the bug here is that invalid JS between eslint-disable
and eslint-enable
trips this module's parser when it should ideally not try to parse anything between such tags:
<script>
/* eslint-disable */
]
/* eslint-enable */
</script>
The bug is reproducible with a regular .js
file too, so I think espree
is not correctly ignoring code between disable/enable sections as it expects the whole file/block to be valid JS, which generally is true for .js
files but it's certainly a problem with templated HTML.
What could work (if eslint-plugin-html
decides to support it) would be support the disable/enable comment as HTML, outside the script block, so the invalid block is not passed to eslint in first place, e.g.
<!-- eslint-disable -->
<script>
]
</script>
<!-- eslint-enable -->
Thank you for the suggestion, it has been implemented and released as part of v7.0.0.
When working with backend MVC projects, sometimes the code could be:
What we need here is to make
eslint-plugin-html
skip a whole<script>
block because code inside it is not valid JS syntax.When using
eslint-plugin-html
, I can not find a proper way to disable the eslint for the script(type=module) block (I do not want ignore the whole file).I know a trick that:
<script><!-- /* eslint-disable */ --></script>
, but it doesn't work for script(type=module)For traditional
<script>
we can use<script><!-- /* eslint-disable */ --></script>
.But for
<script type=module>
, this trick doesn't work anymore because the module script doesn't accept<!--
HTML comment.