problem description

how to limit the scope of introducing css files into the vue js module

the environmental background of the problems and what methods you have tried

Project components are generally divided into three files: html template and css,js. Js is introduced into the first two respectively. The styles set by tag selector in the common style file vender generated by webpack compilation will be confused

how to solve this problem?

A picture is attached, which is the common style compiled by css in a page developer"s tool

directory structure:
_

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

index.js file:

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

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