vue不同组件引用同一个css模块

可以使用Vue的全局样式和组件样式来实现不同组件引用同一个CSS模块。

1. 全局样式

在Vue的入口文件main.js中，使用import引入CSS模块，并在Vue实例中使用全局样式。

import Vue from 'vue';
import App from './App.vue';
import './assets/css/style.css';

new Vue({
  render: h => h(App),
}).$mount('#app');

这样，所有的组件都可以使用style.css中的样式。

2. 组件样式

在组件中，可以使用style标签来引入CSS模块，并使用scoped属性来设置组件样式只作用于当前组件。

<template>
  <div class="container">
    <h1>组件A</h1>
  </div>
</template>

<style scoped>
  @import './assets/css/style.css';

  .container {
    background-color: #eee;
    padding: 10px;
  }
</style>

这样，组件A中就可以使用style.css中的样式，并且不会影响其他组件。其他组件也可以使用相同的方式引用和使用style.css中的样式