Unknown html tag warning of Bootstrap-Vue.js support in WebStorm

Viewed 16509

I'm using WebStorm 2017.2.4 and webpack Vue.js project. I have added bootstrap-vue.js to my project and would like to see hints for it and components support.

But instead of that I have got "Unknown html tag" warning.

screen

BTW: bootstrap-vue works as expected when running project.

Do you have any suggestions how to make it work?

3 Answers

UPDATED on 2019/07/30

PHPShtorm(WebStorm) was updated to 2019.2 and now they added better support for vuejs libraries: https://blog.jetbrains.com/webstorm/2019/07/webstorm-2019-2/#development_with_vue I've just tested and it works. enter image description here

OLD answer

I solved this issue by adding components manually. According to: https://bootstrap-vue.js.org/docs/#individual-components-and-directives I created new file, e.g. bootstrap.js then register globally components which required

import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap-vue/dist/bootstrap-vue.css';
import Vue from 'vue';
import navbar from 'bootstrap-vue/es/components/navbar/navbar';
import container from 'bootstrap-vue/es/components/layout/container';
// ...

Vue.component('b-navbar', navbar);
Vue.component('b-container', container);
// ...

It work for me in phpstorm 2018.1

Bootstrap vue uses very dynamic way of defining components. I am using PyCharm with vuejs extension which is unable to resolve the components when registered using

import { Layout } from 'bootstrap-vue/es/components'

Vue.use(Layout)

What I use to do is make a new file bootstrap.js in components directory, and register all bootstrap components I would use like

import Vue from 'vue'

import bContainer from 'bootstrap-vue/es/components/layout/container'
import bRow from 'bootstrap-vue/es/components/layout/row'
import bCol from 'bootstrap-vue/es/components/layout/col'

Vue.component('b-container', bContainer);
Vue.component('b-col', bCol);
Vue.component('b-row', bRow);

and then import this file in main.js

import './components/bootstrap'

Just a little cleaner solution.

Related