FP S1128: False positive with Vue.js imports

SonarQube Cloud
,
1

Hello

This is a follow-up of Fix FP S1128 (`unused-imports`): Vue.js imports used in templates · Issue #3484 · SonarSource/SonarJS · GitHub (the issue it’s not fully resolved for me) and what I commented beginning here

I copy-paste the body of that issue, so it can be searchable here in the forums as well:

I can share the full files without issues, since I'm working in a open source project. This code smell is reported 3 times in my repo. I attach the relevant line that SonarCloud highlights and the ID of the detected code smell in the dashboard (obtained from the `open` query parameter):


* `AYdGwQKIUNJ8O0FnkdeL`: https://github.com/jellyfin/jellyfin-vue/blob/master/frontend/src/components/Layout/Carousel/Carousel.vue#L53
* `AYdGwQLbUNJ8O0FnkdeO`: https://github.com/jellyfin/jellyfin-vue/blob/master/frontend/src/components/Layout/SwiperSection.vue#L47
* `AYdGwQTPUNJ8O0Fnkde-`: https://github.com/jellyfin/jellyfin-vue/blob/master/frontend/src/pages/playback/music/index.vue#L85

Some key things I noticed:

* All 3 of them are `Remove this unused import of 'Swiper'`. It looks like `SwiperSlide` is correctly detected as used without issues.
* I wonder if it has to do because I also import `Swiper` as a type? (But I don't in all of them)
* I have another guess in that the import is from `swiper/vue` and not `swiper`, and all the affected files import both from `swiper` and `swiper/vue`.
* Local eslint (with `eslint-plugin-imports`) doesn't detect any of those as unused. It does if I remove those components from the template (as expected), so this issue is solely in Sonar's side.

Don't hesitate in contacting me if you need further details to triage this issue or there's something else I can be helpful with to help with this.
4

Hello Fernando,

Thank you for bring this issue up.

If you use PascalCase for your tags in the template, it should be fine. Is that fine for you?

Example:

  <Swiper
      ...
  >
  </Swiper>

Best,
Ilia

5

Hello Ilia

I’d like not to for consistency purposes. I understand that I could always mark it a false positive in SonarCloud dashboard, even if that means that in the future it might reappear when the file is modified or other users are affected by this.

However, if may I ask, why it’s difficult to fix it from your side? Local eslint setup (with Vue-eslint-parser, eslint-plugin-vue and eslint-plugin-imports) has no problems recognising this import as used.

Thank you very much in advance.

6

Hello Fernando,

I have opened an issue for this: Fix FP S1128 (`unused-import`): support lowercase tag name · Issue #3973 · SonarSource/SonarJS · GitHub

Best,
Ilia

1 Like
7

Thank you very much Ilia!

9

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.