关键词搜索

源码搜索 ×
×

前端笔记-vue中引入Bootstrap

发布2019-08-01浏览5541次

详情内容

目录

 

过程演示

源码打包下载


过程演示

首先在项目中导入插件:

  1. npm install jquery --save
  2. npm install bootstrap --save
  3. npm install popper.js --save

程序结构如下:

index.js中添加如下代码

  1. import '../../node_modules/bootstrap/dist/css/bootstrap.css';
  2. import '../../node_modules/bootstrap/dist/js/bootstrap.js';

webpack.bas.config.js中添加如下代码:

const webpack = require('webpack')
  1. module.exports = {
  2. ....
  3. ....
  4. ....,
  5. plugins: [
  6. new webpack.ProvidePlugin({
  7. $: "jquery",
  8. jQuery: "jquery"
  9. })
  10. ]
  11. }

HellWorld.vue中使用展示:

  1. <template>
  2. <div class="hello">
  3. <h1>{{ msg }}</h1>
  4. <button class="btn btn-primary" @click="go">点我跳转</button>
  5. </div>
  6. </template>

程序运行截图如下:

 

 

源码打包下载

https://github.com/fengfanchen/frontUI

相关技术文章

点击QQ咨询
开通会员
返回顶部
×
微信扫码支付
微信扫码支付
确定支付下载
请使用微信描二维码支付
×

提示信息

×

选择支付方式

  • 微信支付
  • 支付宝付款
确定支付下载