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. sdut 2165:Crack Mathmen(第二届山东省省赛原题,数论)

    Crack Mathmen Time Limit: 1000ms   Memory limit: 65536K  有疑问?点这里^_^ 题目描述  Since mathmen take securit ...

  2. hdu 1241:Oil Deposits(DFS)

    Oil Deposits Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) Total ...

  3. onSaveInstanceState和onRestoreInstanceState

    本文摘自: http://h529820165.iteye.com/blog/1399023 Android calls onSaveInstanceState() before the activi ...

  4. poj 1463(树形dp)

    题目链接:http://poj.org/problem?id=1463 思路:简单树形dp,如果不选父亲节点,则他的所有的儿子节点都必须选,如果选择了父亲节点,则儿子节点可选,可不选,取较小者. #i ...

  5. 建模算法(十一)——目标规划

    求解多目标规划的思路 1.加权系数法 为每一个目标加一个权系数,把多目标模型转化成单一目标模型.但是困难时确定合理的权系数,以反映不同目标之间的重要程度. 2.优先等级法 将各目标按其重要程度分为不同 ...

  6. MySQL监控系统MySQL MTOP的搭建

    MySQLMTOP是一个由Python+PHP开发的MySQL企业级监控系统.系统由Python实现多进程数据采集和告警,PHP实现WEB展示和管理.最重要是MySQL服务器无需安装任何Agent,只 ...

  7. 在Windows下利用MinGW编译FFmpeg

    目录 [隐藏]  1 环境与软件 2 第一步:安装MinGW 3 第二步:配置编译环境 4 第三步:配置SDL 5 第四步:编译 5.1 编译faac 5.2 编译fdk-aac 5.3 编译x264 ...

  8. 二分搜索 UVALive 6076 Yukari's Birthday (12长春K)

    题目传送门 题意:问使得sum (k^i) = n || n -1 (1 <= i <= r) 的min (r*k)组合的r和k  分析:r的最大不会超过40,枚举r,二分搜索k.注意会爆 ...

  9. 错误3 error C3859: 超过了 PCH 的虚拟内存范围;请使用“-Zm120”

    在工程上单击右键,属性,C/C++,最后一项,命令行,在里面/Zm200或者编译器提示的大小解决.

  10. CodeForces Round 194 Div2

    A. Candy Bagstime limit per test1 secondmemory limit per test256 megabytesinputstandard inputoutputs ...