vue项目引入外部UI，不同页面自定义不同样式

做项目有些需求是项目要改版，但是又想留一个老项目的入口，所以不同页面要用不同样式，对于引入外部UI来说是个麻烦事，因为要设置外部UI组件的样式必须是全局设置，也就是说<style></style>中不能带有

<style scoped lang="less"> scoped ，因为带有scoped变成页面独有样式 设置不了外部UI样式，那么问题来了，老项目保留老样式，新项目保留新样式，又只能全局设置，肯定会相互影响，所以就想了个办法，单独新建一个bass.less，不同页面最大的盒子设置不同类名，然后每个页面的UI样式包裹在这个类名之中，就可以实现引入外部UI组件不同页面显示不同样式，比如minit UI

页面1

.calss111{ 

    .mint-cell {

        color: #333;

    }

}

 

页面2

.calss222{ 

    .mint-cell {

        color: #fff;

    }

}

通过不同页面最大盒子的类名区分来写，就可以实现引入外部UI组件不同页面显示不同样式，每个页面样式不相互影响