question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

First auto-import is added on same line as `<script>`

See original GitHub issue

When I auto import something in a .vue file, the first time it add the code on the same line as the opening <script> tag.

Actual:

<script lang="ts" setup>import { PropType } from 'vue'
import { Story } from '../types'
import StoryListItem from './StoryListItem.vue'

const props = defineProps({
  stories: {
    type: Array as PropType<Story[]>,
    required: true,
  },
})
</script>

Expected:

<script lang="ts" setup>
import { PropType } from 'vue'
import { Story } from '../types'
import StoryListItem from './StoryListItem.vue'

const props = defineProps({
  stories: {
    type: Array as PropType<Story[]>,
    required: true,
  },
})
</script>

Reproduction steps:

  • Create an empty .vue file
  • Add a script section
  • Auto import something using the intellisense popover

Volar v0.31.1

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:4
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
johnsoncodehkcommented, Feb 12, 2022

Just have a idea to fix. 😃

0reactions
Akryumcommented, Mar 29, 2022

Looks like the issue is back @johnsoncodehk

image

image

image

Read more comments on GitHub >

github_iconTop Results From Across the Web

First auto imports added before file header comment #31508
Successfully merging a pull request may close this issue. Handle header comments better by comparing its end line with first node line microsoft ......
Read more >
Add "one import per line" auto import style : PY-20100
Right now PyCharm auto import is arrenging imports from the same module into single line. Would be nice if one could set the...
Read more >
Visual Studio Code Automatic Imports - typescript
Auto import in JavaScript and TypeScript automatically add imports when you accept a suggestion. ... This can be a time saver if you...
Read more >
Python import: Advanced Techniques and Tips
In the first line, import math , you import the code in the math module and make it available to use. In the...
Read more >
JavaScript Programming with Visual Studio Code
Automatic imports speed up coding by suggesting available variables throughout your project and its dependencies. When you select one of these suggestions, VS ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found