在进行vue的学习,项目中需要引入bootstrap、jquery的步骤。

一、引入jQuery

在当前项目的目录下(就是package.json),运行命令 cnpm install jquery --save-dev  这样就将jquery安装到了这个项目中。

然后修改webpack.base.conf.js(在build文件下)两个地方:

1:加入

var webpack=require('webpack');

2 在module.exports的里面加入

plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]

最后在main.js中加入import $ form 'jquery',完成jquery的引入

二、引入 bootstrap.css文件:

修改webpack.base.conf.js

resolve: {
  extensions: ['.js', '.vue', '.json'],
  alias: {
  'vue$': 'vue/dist/vue.esm.js',
  '@': resolve('src'),
  'bootstrap':resolve('src/assets/bootstrap'),
  }
},

在main.js中import引入

import 'bootstrap/js/bootstrap.min.js'
import 'bootstrap/css/bootstrap.min.css'

三、引入bootstrap.min.js文件:

在main.js中import引入

import 'bootstrap/js/bootstrap.min.js'

来自:http://www.cnblogs.com/xiaofenguo/p/6605302.html

在进行vue的学习,项目中需要引入bootstrap、jquery的步骤。的更多相关文章

  1. 在Vue&Element前端项目中,使用FastReport + pdf.js生成并展示自定义报表

    在我的<FastReport报表随笔>介绍过各种FastReport的报表设计和使用,FastReport报表可以弹性的独立设计格式,并可以在Asp.net网站上.Winform端上使用, ...

  2. 在Vue&Element前端项目中,对于字典列表的显示处理

    在很多项目开发中,我们为了使用方便,一般都会封装一些自定义组件来简化界面的显示处理,例如参照字典的下拉列表显示,是我们项目中经常用到的功能之一,本篇随笔介绍在Vue&Element前端项目中如 ...

  3. RN 导入原有Xcode项目中,引入Pod依赖出现的问题与解决

    RN 导入原有Xcode项目中,引入Pod依赖出现的问题与解决 前言 最近学习React Native技术.将RN引入到原来Xcode项目中有一步:给原来Xcode项目添加所需要的Pod依赖 写好Po ...

  4. eclipse java项目中明明引入了jar包 为什么项目启动的时候不能找到jar包 项目中已经 引入了 com.branchitech.app 包 ,但时tomcat启动的时候还是报错? java.lang.ClassNotFoundException: com.branchitech.app.startup.AppStartupContextListener java.lang.ClassN

    eclipse java项目中明明引入了jar包 为什么项目启动的时候不能找到jar包 项目中已经 引入了 com.branchitech.app 包 ,但时tomcat启动的时候还是报错?java. ...

  5. 擦他丫的,今天在Django项目中引用静态文件jQuery.js 就是引入报错,终于找到原因了!

    擦 ,今天在Django项目中引用静态文件jQuery.js 就是引入报错,终于找到原因了! 问题在于我使用的谷歌浏览器,默认使用了缓存,导致每次访问同一个url时,都返回的是缓存里面的东西.通过谷歌 ...

  6. vue - vue-cli脚手架项目中组件的使用

    在webpack-simple模板中,包括webpck模板.一个.vue文件就是一个组件. 为什么会这样呢?因为webpack干活了!webpack的将我们所有的资源文件进行打包.同时webpack还 ...

  7. VUE+webpack+npm项目中的RSA加解密

    一.安装jsencrypt npm i jsencrypt node_modules文件夹中出现jsencrypt 二.引入jsencrypt 在main.js中import: import JsEn ...

  8. Vue、Element-ui项目中如何使用Iconfont(阿里图标库)

    我们使用element-ui.vue开发网站的时候,往往图标是起着很重要的作用. 下面是vue.element-ui项目,如何使用阿里iconfont图标库的方法. 准备工作 1. 先注册,再登录.找 ...

  9. Vue cli2.0 项目中使用Monaco Editor编辑器

    monaco-editor 是微软出的一条开源web在线编辑器支持多种语言,代码高亮,代码提示等功能,与Visual Studio Code 功能几乎相同. 在项目中可能会用带代码编辑功能,或者展示代 ...

随机推荐

  1. 架构-虚拟路由器冗余协议【原理篇】VRRP详解

    转自:http://zhaoyuqiang.blog.51cto.com/6328846/1166840/ 为什么要使用VRRP技术 我们知道,为了实现不同子网之间的设备通信,需要配置路由.目前常用的 ...

  2. 树莓派进阶之路 (021) - 3.2inch RPi LCD (B)

    参考文档:http://www.waveshare.net/wiki/3.2inch_RPi_LCD_(B) 产品特点 320x240分辨率 电阻式触摸控制 兼容并可直接插入任何版本树莓派 提供Ras ...

  3. 【jsp】怎么在jsp文件中引入静态文件(.js .css)

    如果在jsp文件中引入静态文件比如(.js或.css等等),可以在使用 /项目名称/路径 的方式,但是这种方式如果在修改了项目了名称后就显得比较麻烦了.除了之外还许多方式,比如相对路径等等.一般情况下 ...

  4. 【Oracle】Oracle索引

    在关系数据库中,索引是一种与表有关的数据库结构,它可以使对应于表的SQL语句执行得更快.索引的作用相当于图书的目录,可以根据目录中的页码快速找到所需的内容. 对于数据库来说,索引是一个必选项,但对于现 ...

  5. 转 mongodb win7 32位系统安装以及配置

    mongodb win7 32位系统安装以及配置   今天安装 win7 32位系统 mongodb 费了好大劲..记录一下,希望相同的同学可以少踩点坑. 1.安装 我安装的是3.2.4  地址:ht ...

  6. SQL 给字符串补0

    第一种方法: right('00000'+cast(@count as varchar),5) 其中'00000'的个数为right函数的最后参数,例如这里是5,所以有5个0 @count就是被格式化 ...

  7. iOS 9 学习系列: Xcode Code Coverage

    Code coverage 是一个计算你的单元測试覆盖率的工具. 高水平的覆盖给你的单元測试带来信心.也表明你的应用被彻底的測试过了. 你可能写了几千个单元測试,但假设覆盖率不高.那么你写的这套測试可 ...

  8. sessionId与cookie 的关系(百度文库)

    这篇文档讲的很清楚,推荐阅读 http://wenku.baidu.com/view/2ecf0b350b4c2e3f572763d1.html

  9. Android 数据分析系列一:sharedPreferences

    Android数据存储方式,包括下面四种: 1. Shared Preferences:用来存储"key-value"paires格式的数据,它是一个轻量级的键值存储机制,只可以存 ...

  10. 关于Android NDK中调用第三方的动态库

    因为最近在整合Android 上RTSP播放器的网络库,因需要调用自己编译的网络库,调用一直出现问题,开始时是直接在Android.mk 中加入LOCAL_SHARED_LIBRARIES := li ...