Vue 4.0——Vue与Bootstrap整合解决方案
解决方案1、安装jQuery、 Bootstrap、popper.js依赖npm install jquery --savenpm install bootstrap --savenpm install popper.js --save2、配置 main.js//main.jsimport Vue from "vue";import App from "./App...
·
解决方案
1、安装jQuery、 Bootstrap、popper.js依赖
npm install jquery --save
npm install bootstrap --save
npm install popper.js --save
2、配置 main.js
//main.js
import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
//在这里引入 bootstrap。默认只引入 bootstrap 中的 js,css 需要另外引入,我的 bootstrap.ss 在APP.vue中引入的
import "bootstrap";
//也可以在这里引入 bootstrap.css ;
//import "bootstrap/dist/css/bootstrap.css";
Vue.config.productionTip = false;
new Vue({
router: router,
store: store,
render: h => h(App)
}).$mount("#app");
只是引入 bootstrap.css,代码参考:
<style> // 因为我的 bootstrap 文件经过了我自己的调整,所以单独放在 assets 文件夹中做单独引入。 //如果你只是想使用原生的 bootstrap,直接在 main.js 中引入 css 文件即可。 @import "./assets/css/bootstrap.css"; </style>
3、示例
<template>
<div class="container">
<div class="row">
<div class="col-md-6">
<button class="btn btn-primary">测试按钮</button>
</div>
</div>
</div>
</template>
Vue UI 安装
https://blog.csdn.net/qq_43719932/article/details/97369140
参考文章
https://blog.csdn.net/weixin_34258838/article/details/88621425
更多推荐
已为社区贡献22条内容
所有评论(0)