javascript - berskop dalam gaya fail tunggal vue adalah tidak sah, sila berikan saya sebabnya.
仅有的幸福
仅有的幸福 2017-05-19 10:27:37
0
3
1220

a.vue

<template>
    <p>
        <button class="btn btn-primary">11a.vue</button>
    </p>
</template>
<style scoped>
    @import '../css/bootstrap.css';
    
</style>

b.vue

<template>
    <p>
        <button class="btn btn-primary">b.vue</button>
    </p>
</template>
<style scoped>
    
</style>

Tetapi apabila mengakses b.vue, gaya boostrap dilampirkan tidak mempunyai kesan mengasingkan skop?

仅有的幸福
仅有的幸福

membalas semua(3)
phpcn_u1582

Saya rasa ini kerana @import

Pertama sekali, mari kita lihat prinsip skop dalam vue-loader:
https://vue-loader.vuejs.org/...

Halaman dengan gaya bootstrap hanya bermakna css bootstrap belum diproses oleh vue-loader Kemudian saya mencari kata kunci postcss dan @import berikut, dan kemudian menemui pemalam postcss-import:
https://www. . npmjs.com/package…

Saya rasa jika anda menggunakan pemalam ini, masalahnya harus diselesaikan, tetapi saya belum mengujinya, itu hanya spekulasi

过去多啦不再A梦

Cari halaman induk b, naik tahap demi tahap, ia mesti dirujuk oleh halaman itu

大家讲道理

Letak sahaja@import '../css/bootstrap.css';去掉;
换成<style src="../css/bootstrap.css" scoped></style> dan sudah siap

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan