在进行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. 关于iOS应用通过OpenURL在设置打开相机权限,然后原应用会立即崩溃(重启)的理解

    最近偶然发现的一个怪现象: 应用需要相机权限,如果检测到没有开启权限,我们代码内,通过openURL跳转设置界面 //打开应用设置 let url:NSURL = NSURL(string: UIAp ...

  2. keras中的模型保存和加载

    tensorflow中的模型常常是protobuf格式,这种格式既可以是二进制也可以是文本.keras模型保存和加载与tensorflow不同,keras中的模型保存和加载往往是保存成hdf5格式. ...

  3. linux sshd ssh 服务的启动和使用

    这里使用sshd服务登录到linux系统的方法,不少同学走了弯路,包括我,我一直使用vmware虚拟linux学习使用的,后来windows病毒的原因转入到linux系统中使用 1,sshd服务安装 ...

  4. 10个很棒的学习Android 开发的网站

    1. Android Developers 作为一个Android开发者,官网的资料当然不可错过,从设计,培训,指南,文档,都不应该错过,在以后的学习过程中慢慢理解体会. 2. Android Gui ...

  5. 【Android】Android连接SQLite3数据库的操作

    在前面使用SQLite3的时候,并没有留意到有SQLiteOpenHelper这个类,所以只好在Activity里面去创建和维护数据库跟数据表的创建. 但是,现在有了SQLiteOpenHelper这 ...

  6. 【Java】解析Java对XML的操作

    目录结构: contents structure [+] 什么是XML 解析XML 使用DOM解析 使用SAX解析 使用PULL解析 使用dom4j解析xml dom4j的部分API 打印一个XML文 ...

  7. 安装gitlab遇到的问题

    参考文章: http://www.pickysysadmin.ca/2013/03/25/how-to-install-gitlab-5-0-on-centos-6/ 一直跟着这篇文章做,还挺顺利的, ...

  8. 12C -- 配置EM Express的端口

    EM Express是基于web接口的图形化数据库管理工具. 内嵌到数据库中,可以用来监控.管理数据的性能和完成大多数管理工作. EM Express是轻量级的管理工具,减少了数据库服务器的开销.没有 ...

  9. MySQL -- 全文检索(查询扩展检索)

    通常用在查询的关键词太短,用户需要隐含知识进行扩展.例如,查单词database时,用户可能还希望不仅仅包含database的文档,可能还指包含mysql.oracle.db2等单词.这时就需要查询扩 ...

  10. 条件触发和边缘触发 及 epoll 的长处

    条件触发: 仅仅要输入缓冲有数据就会一直通知该事件 边缘触发: 输入缓冲收到数据时仅注冊1次该事件.即使输入缓冲中还留有数据,也不会再进行注冊 水平触发(level-triggered.也被称为条件触 ...