Плагин на VueJs для сайта, переопределяется css класс, как быть?

Question

[dinya17]

Всем добрый день.
Это продолжение вопроса Упаковка Angular или Vue в один файл для использования на стороннем сайте?

В данный момент дело обстоит таким образом.
Плагин написан, все прекрасно работает, но есть НО. Я использовал VueCli3, VuetifyJs и его компоненты.
Когда я переношу все упакованные компоненты на сторонний сайт. стили моего плагина съезжают.
Из документации я считал , что VueCli3 сбилдит все стили и JS в несколько файлов и т.к. это все находится внутри template то никакие стили не будут затронуты.

Может мне кто - нибудь подсказать что делать дальше или как правильно сбилдить проект чтобы стили не съезжали.

Comments

[Андрей Седышев]

Покажите код, как вы подключаете плагин и его стили на странице.

[Сергей delphinpro]

т.к. это все находится внутри template то никакие стили не будут затронуты.

вы scoped атрибут стилям сделали?

Но в любом случае css стили глобальны от природы, и если на стороннем сайте будет css правило

div { border: 10px solid red; }

То все дивы вашего компонента по-любому будут иметь красную рамку, если вы предусмотрительно не обнулите этот стиль в своем компоненте

border: none;
/* или */
border: initial;

т.е. Если вам нужна полная независимость от чужих стилей, то вы должны описать все стили O_o

ps initial классная штука, но слишком новая...
pps а вдруг на стороннем сайте будет стиль с important?
ppps задача странная, как минимум..

[dinya17]

Сергей delphinpro, спасибо за совет. Решилось все прописыванием стилей в компонентах. initial тоже помог.