파일을 지우지 않고 스코프 형식의 태그로 Import하려면 어떻게 해야 합니까?

파일을 지우지 않고 스코프 형식의 태그로 Import하려면 어떻게 해야 합니까?

를 사용하여 스타일 태그의 css 파일을 Import합니다..vue파일. 스코프된 css 파일은 내 페이지의 모든 css에 영향을 주고 있으며 현재 컴포넌트에만 영향을 주고 싶습니다.

<template>
    <div>
        <router-view></router-view>
    </div>
</template>

<style type="text/css" scoped>
    @import '~bootstrap/dist/css/bootstrap.css';
</style>

스코프가 지정된 css 파일을 현재 컴포넌트로 Import하려면 어떻게 해야 합니까?

새스 쓸 수 있어요?

먼저 sass-loader를 설치해야 합니다.

npm install sass-loader node-sass --save-dev   

그 후 다음과 같이 사용할 수 있습니다.

<template>
    <div class="container">
        <router-view></router-view>
    </div>
</template>

<style lang="scss" scoped>
    .container {
       @import '~bootstrap/dist/css/bootstrap.css';
    }
</style>

언급URL : https://stackoverflow.com/questions/53602323/how-do-i-import-files-into-a-scoped-style-tag-without-it-bleeding-out