vue js模塊中引入css文件 怎么限制作用域

問題描述

vue js模塊中引入css文件 怎么限制作用域

問題出現(xiàn)的環(huán)境背景及自己嘗試過哪些方法

項目組件一般分為html模板，css，js三個文件，js分別引入前兩者，webpack編譯后生成的公共樣式文件vender中使用標(biāo)簽選擇器設(shè)置的樣式會出現(xiàn)錯亂

怎么解決這個問題？

附一張圖，是某個頁面開發(fā)者工具中的css編譯后的公共樣式

目錄結(jié)構(gòu)：
_

|_index.js
|_style.css
|_tmpl.html

index.js文件：

let style = require('./style.css')
if(style.locals) style = style.locals

export default {
    template,
    data() {
        return {
            style
        }
    },
}