Javascript 如何不重写刀片php文件中的css文件

在laravel上的app.js上，我导入了一个库，它使用的是Bootstrap4

app.js

import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css' //Bootstrap 4.3.1
import 'bootstrap-vue/dist/bootstrap-vue.css'

Vue.use(BootstrapVue)

const files = require.context('./', true, /\.vue$/i);
files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default));

const app = new Vue({
    el: '#app',
});

然后在我的blade php文件中，我刚刚调用了它

<script src="{{ asset('js/app.js')}}" defer></script>

问题解决了，但是我不能在vue组件中使用引导css

---

你知道怎么解决这个问题吗？因为我认为我的app.js中的bootstrap正在覆盖我的blade php文件中的bootstrap 3.3.7。

尝试在您需要的组件中导入bootstrap css

在vue组件中，在样式标记中，当它具有

作用域

属性时，CSS将仅应用于当前组件

<style scoped>
  @import 'path/to/bootstrap_verison.min.css';
  /*CSS styles*/
</style>

@导入'path/to/bootstrap_verison.min.css'；
/*CSS样式*/

尝试在您需要的组件中导入引导css

在vue组件中，在样式标记中，当它具有

作用域

属性时，CSS将仅应用于当前组件

<style scoped>
  @import 'path/to/bootstrap_verison.min.css';
  /*CSS styles*/
</style>

@导入'path/to/bootstrap_verison.min.css'；
/*CSS样式*/

如果您使用的是构建在

bootstrap4

之上的

Bootstrap Vue

，我建议您放弃/不要使用

admin lte

，只需自己打开管理面板，否则您将遇到更多的兼容性问题。在Bootstrap4中自己编写admin很容易。Flex CSS，即bs4中的Flex row和Flex column非常令人惊讶，例如，您正在使用的代码

Bootstrap Vue

，它构建在

Boostrap4

之上，我建议您放弃/不使用

admin lte

，只需自己操作管理面板，否则您将遇到更多的兼容性问题。在Bootstrap4中自己编写admin很容易。Flex CSS，即bs4中的Flex行和Flex列非常惊人，示例代码