npm install
npm install jquery --save

//bootsrap3.36 与 jquery3不兼容,下载jquery时可能需要确定版本号

npm install jquery@.x  --save

编辑 resources/assets/sass/app.scss

@import "variables";

@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";

创建variables.scss,改写bootstrap样式变量

$body-bg:               #FEFEFE;
$brand-primary: darken(skyblue, 6.5%);
$panel-bg: #AFEEEE;

创建文件: resources/assets/js/app.js

window.$ = window.jQuery = require('jquery');

require('bootstrap-sass');

$( document ).ready(function() {
console.log($.fn.tooltip.Constructor.VERSION);
});

以上为引入jquery, 引入bootstrap.js, console.log 记录bootstrap版本号(测试用)

编辑项目根目录下的 gulpfile.js :

var elixir = require('laravel-elixir');

elixir(function(mix) {
mix.sass('app.scss')
.browserify('app.js')
.version(['css/app.css', 'js/app.js']);
});

运行gulp生成文件,在app.blade.php里就可以进行引入了

...

<link href="{{ elixir('css/app.css') }}" rel="stylesheet">

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

如果使用less,建立app.less

@import "node_modules/bootstrap-less/bootstrap/bootstrap.less";
//@body-bg: silver;
@icon-font-path: "/fonts/bootstrap/";
@import "node_modules/bootstrap-less/bootstrap/utilities.less";

把gulpfile.js中更换sass未less即可

laravel elixir的更多相关文章

  1. laravel5.4+vue+element简单搭建(gulp+laravel Elixir)(转)

    如今laravel来到5.4版本,更方便引入vue了,具体步骤如下: 下图为我动到的文件 1.下载laravel5.4 2.命令行(laravel5.4目录下):composer install 3. ...

  2. Laravel 5 性能优化技巧

    说明 性能一直是 Laravel 框架为人诟病的一个点,所以调优 Laravel 程序算是一个必学的技能. 接下来分享一些开发的最佳实践,还有调优技巧,大家有别的建议也欢迎留言讨论. 这里是简单的列表 ...

  3. laravel 中 与前端的一些事2 之使用Gulp编译sass

    下载所有依赖npm的packagist: 下载了前端laravel  elixir编译所需要的全部工具: gulp编译scss文件: scss文件的默认存放位置: 输入命令gulp 开始编译scss文 ...

  4. laravel 5 优化

    性能一直是 Laravel 框架为人诟病的一个点,所以调优 Laravel 程序算是一个必学的技能. 接下来分享一些开发的最佳实践,还有调优技巧,大家有别的建议也欢迎留言讨论. 这里是简单的列表: 配 ...

  5. 十个 Laravel 5 程序优化技巧

    性能一直是 Laravel 框架为人诟病的一个点,所以调优 Laravel 程序算是一个必学的技能. 接下来分享一些开发的最佳实践,还有调优技巧,大家有别的建议也欢迎留言讨论. 这里是简单的列表: 配 ...

  6. 基于 Laravel 开发博客应用系列 —— 从测试开始(二):使用Gulp实现自动化测试

    3.使用 Gulp 进行 TDD(测试驱动开发) Gulp 是一个使用 JavaScript 编写的自动化构建工具.用于对前端通用任务(如最小化.压缩.编译)进行自动构建.Gulp 还可以用来监控源代 ...

  7. PHP and laravel知识点小小积累

    function () use ($x, &$y){} 自从PHP5.3开始有了closure/匿名函数的概念,在这里的use关键词的作用是允许匿名函数capture到父函数scope 内存在 ...

  8. 十个技巧快速优化你的Laravel 5 程序

    性能一直是 Laravel 框架为人诟病的一个点,所以调优 Laravel 程序算是一个必学的技能. 接下来分享一些开发的最佳实践,还有调优技巧,大家有别的建议也欢迎留言讨论. 这里是简单的列表: 配 ...

  9. laravel性能优化技巧(转)

    说明 性能一直是 Laravel 框架为人诟病的一个点,所以调优 Laravel 程序算是一个必学的技能. 接下来分享一些开发的最佳实践,还有调优技巧,大家有别的建议也欢迎留言讨论. 这里是简单的列表 ...

随机推荐

  1. DRF如何序列化外键的字段

    我觉得在有些应用场景下,这个操作是有用的,因为可以减少一个AJAX的请求,以增加性能. 当然,是二次请求,还是一次传输.这即要考虑用户体验,还要兼顾服务器性能. 一切是有条件的平衡吧.就算是一次传输, ...

  2. jquery 事件冒泡 解决 ie firefox 兼容性问题

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  3. 5个让你的SaaS应用大卖的技巧

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 今天推荐的文章和具体的技术无关,但是对于创业的小伙伴应该有帮助. 去年底到今年,企业应用尤其 ...

  4. loj 1154(最大流+枚举汇点)

    题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=26868 思路:拆点,容量为最多能跳的步数,然后设立一个超级源点,源 ...

  5. SharedPreferences存储

    *通过getSharedPreferences()方法获得SharedPreferences对象 SharedPreferences pref = getShaedPreferences(“key”, ...

  6. linux下Gnome桌面环境的安装

    在实际工作中,无论是生产环境还是公司内部环境.很多时候装的linux系统都是最小化安装的.即没有桌面环境, 那么如果有时我们又需要一个桌面环境.该怎么安装呢?其实不难,现笔者将安装方法分享如下. 测试 ...

  7. XML的验证模式

    XML文件的验证模式保证了XML文件的正确性,而比较常用的验证模式有两种:DTD和XSD. DTD与XSD区别 DTD(Document Type Definition)即文档类型定义,是一种XML约 ...

  8. BZOJ4299 : Codechef FRBSUM

    若$[0,i]$的数都可以得到,那么$[1,所有不大于i+1的数的和]$的数都可以得到. 如此暴力枚举答案,用可持久化线段树支持查询,因为每次数字至少翻一倍,所以复杂度为$O(m\log^2n)$. ...

  9. BZOJ1665 : [Usaco2006 Open]The Climbing Wall 攀岩

    直接BFS貌似复杂度飞起来了,于是我们用k-d tree优化找点的过程即可.时间复杂度$O(n\sqrt{n})$. #include<cstdio> #include<algori ...

  10. TYVJ P1020 导弹拦截 Label:水

    题目描述 某国为了防御敌国的导弹袭击,发展出一种导弹拦截系统.但是这种导弹拦截系统有一个缺陷:虽然它的第一发炮弹能够到达任意的高度,但是以后每一发炮弹都不能高于前一发的高度.某天,雷达捕捉到敌国的导弹 ...