'Auto import' do not work anymore

These steps are how I got this bug ( maybe it's not a bug ).

 

I'm using WebStorm 2018.2 and my project is made with Vue Cli 3 and typescript 3.x.x

 

1. I created component named 'TopArea'

2. I wrote 'TopA', then 'live template' shows me import 'TopArea'

3. I pressed enter key, and 'auto import' created text in typescript like 'import TopArea from '../components/TopArea.vue';'

4. I wanted to change prefix of this import route. ex) '../components/TopArea.vue';'  --> '@/components/TopArea.vue';'

5. I fixed my setting in 'Editor -> General -> Auto Import', 'Editor -> Code Style -> JavaScript', 'Editor -> Code Style -> TypeScript' and 'Editor -> Live Templates -> Vue'.

6. After done this setting, 'Alt+Enter' does not show intention. and auto creating import route.

 

Below screen is my settings.

 

How can I fix this problem

 

8 comments
Comment actions Permalink

Neither webpack aliases nor tsconfig.json path mappings are supported in .vue files with lang="ts" (see WEB-34105, WEB-29799), so imports like import {TopArea} from '@/components/TopArea.vue' won't work... You need using relative imports

1
Comment actions Permalink

@ElenaPogorelova

Thanks to your comment.

I think it's already mapped in tsconfig.json

This is my tsconfig.json

0
Comment actions Permalink

>I think it's already mapped in tsconfig.json

 

please see my comment - tsconfig.json path mappings are NOT supported in .vue files

1
Comment actions Permalink

@ElenaPogorelova

 

Oh, I'm sorry. Forgive my impatience.

Now I rollback my settings but it still not working...

I tried to remove WebStorm entirely, it did not solve my problem too.

0
Comment actions Permalink

auto-import doesn't have anything to do with live templates... do you mean that you don't have Vue component auto-imported when you choose its name from completion in <template> section? or?

1
Comment actions Permalink

@ElenaPogorelova

Yes! Absolutely right!! My question is about that.

When I choose an item in intention, a completion tag is inserted in HTML part.

But it's not auto-imported in typescript-section.

 

0
Comment actions Permalink

works fine for me if Add Typescript imports automatically and On code completion are enabled in Settings | Editor | General | Auto Import. Can you share a sample projec that can be used to recreate the issue? Does it persist in a new project created with vue cli?

0
Comment actions Permalink

@ElenaPogorelova

I solved this problem yesterday. Even though I remove Webstorm and install again and again, this problem has occurred continuous. So I tried to remove all about 'jetbrain' through 'regedit', and I installed again after these works, then Auto Import successfully worked.

Thank you for your interests! I'm glad to talking with you and happy to solve this. :) Have a good day!

0

Please sign in to leave a comment.