現在你已經安裝好 Elixir,未來任何時候你都能進行編譯及合并文件! 在項目根目錄下的 gulpfile.js 已經包含了所有的 Elixir 任務。
## 編譯 Less
~~~
elixir(function(mix) {
mix.less("app.less");
});
~~~
在上述例子中,Elixir 會假設你的 Less 文件保存在 resources/assets/less 里。
## 編譯多個 Less 文件
~~~
elixir(function(mix) {
mix.less([
'app.less',
'something-else.less'
]);
});
~~~
## 編譯 Sass
~~~
elixir(function(mix) {
mix.sass("app.sass");
});
~~~
在上述例子中,Elixir 會假設你的 Sass 文件保存在 resources/assets/sass 里。
默認情況下, Elixir 會使用 LibSass 作為編譯引擎。 在某些情況下, 使用 Ruby 版本的 Sass 編譯可能更有優勢,雖然運行不是很快但是有更多的特性。假設你已經安裝了 Ruby 和 Sass gem (gem install sass), 你可以使用 Ruby 模式,比如像這樣:
~~~
elixir(function(mix) {
mix.rubySass("app.sass");
});
~~~
## 無 Source Maps 編譯
~~~
elixir.config.sourcemaps = false;
elixir(function(mix) {
mix.sass("app.scss");
});
~~~
Source maps 默認情況下是開啟的。因此, 每當一個文件被編譯,你都會在當前目錄下看到 *.css.map 文件。這個映射文件允許你在進行 debugging 的時候,追溯編譯后的樣式選擇器到原有的 Sass 或者 Less 文件!如果你想要關閉這個功能,可以使用上面的代碼。
## 編譯 CoffeeScript
~~~
elixir(function(mix) {
mix.coffee();
});
~~~
在上述例子中,Elixir 會假設你的 CoffeeScript 文件保存在 resources/assets/coffee 里。
## 編譯所有的 Less 及 CoffeeScript
~~~
elixir(function(mix) {
mix.less()
.coffee();
});
~~~
## 觸發 PHPUnit 測試
~~~
elixir(function(mix) {
mix.phpUnit();
});
~~~
## 觸發 PHPSpec 測試
~~~
elixir(function(mix) {
mix.phpSpec();
});
~~~
## 合并樣式文件
~~~
elixir(function(mix) {
mix.styles([
"normalize.css",
"main.css"
]);
});
~~~
傳遞給此方法的文件路徑均相對于 resources/css 目錄。
## 合并樣式文件且保存在自定義的路徑
~~~
elixir(function(mix) {
mix.styles([
"normalize.css",
"main.css"
], 'public/build/css/everything.css');
});
~~~
從特定相對目錄合并樣式文件
elixir(function(mix) {
mix.styles([
"normalize.css",
"main.css"
], 'public/build/css/everything.css', 'public/css');
});
styles 與 scrtips 方法可以通過傳入第三個參數來決定來源文件的相對目錄。
## 合并指定目錄里所有的樣式文件
~~~
elixir(function(mix) {
mix.stylesIn("public/css");
});
~~~
## 合并腳本文件
~~~
elixir(function(mix) {
mix.scripts([
"jquery.js",
"app.js"
]);
});
~~~
同樣的,傳遞給此方法的文件路徑均相對于 resources/js 目錄
## 合并指定目錄里所有的腳本文件
~~~
elixir(function(mix) {
mix.scriptsIn("public/js/some/directory");
});
~~~
## 合并多組腳本文件
~~~
elixir(function(mix) {
mix.scripts(['jquery.js', 'main.js'], 'public/js/main.js')
.scripts(['forum.js', 'threads.js'], 'public/js/forum.js');
});
~~~
## 壓縮文件并加上哈希的版本號
~~~
elixir(function(mix) {
mix.version("css/all.css");
});
~~~
這個動作會為你的文件名稱加上獨特的哈希值,以防止文件被緩存。舉例來說,產生出來的文件名稱可能像這樣:all-16d570a7.css。
接著在你的視圖中,你能夠使用 elixir() 函數來正確加載名稱被哈希后的文件。舉例如下:
`<link rel="stylesheet" href="{{ elixir("css/all.css") }}">`
程序的作用下,elixir() 函數會將參數內的源文件名轉換成被哈希后的文件名并加載。是否有如釋重擔的感覺呢?
您也可以傳給一個數組給 version 方法來為多個文件進行版本管理:
~~~
elixir(function(mix) {
mix.version(["css/all.css", "js/app.js"]);
});
~~~
~~~
<link rel="stylesheet" href="{{ elixir("css/all.css") }}">
<script src="{{ elixir("js/app.js") }}"></script>
~~~
## 復制文件到新的位置
~~~
elixir(function(mix) {
mix.copy('vendor/foo/bar.css', 'public/css/bar.css');
});
~~~
## 將整個目錄都復制到新的位置
~~~
elixir(function(mix) {
mix.copy('vendor/package/views', 'resources/views');
});
Trigger Browserify
elixir(function(mix) {
mix.browserify('index.js');
});
~~~
Want to require modules in the browser? Hoping to use EcmaScript 6 sooner than later? Need a built-in JSX transformer? If so, Browserify, along with the browserify Elixir task, will handle the job nicely.
This task assumes that your scripts are stored in resources/js, though you're free to override the default.
## 方法連接
當然,你能夠串連 Elixir 大部份的方法來建立一連串的任務:
~~~
elixir(function(mix) {
mix.less("app.less")
.coffee()
.phpUnit()
.version("css/bootstrap.css");
});
~~~
- 前言
- 發行說明/L5新特性
- 升級向導
- 升級到 5.0.16
- 從 4.2 升級到 5.0
- 從 4.1 升級到 4.2
- 從 4.1.x 升級到 4.1.29
- 從 4.1.25 升級到 4.1.26
- 從 4.0 升級到 4.1
- 貢獻向導
- 環境配置
- 安裝
- 配置
- 基本功能
- 路由
- 基本路由
- CSRF 保護
- 方法欺騙
- 路由參數
- 命名路由
- 路由群組
- 路由模型綁定
- 拋出 404 錯誤
- 中間件
- 建立中間件
- 注冊中間件
- 可終止中間件
- 控制器
- 基礎控制器
- 控制器中間件
- 隱式控制器
- RESTful 資源控制器
- 請求
- 取得請求實例
- 取得輸入數據
- 舊輸入數據
- Cookies
- 上傳文件
- 其他的請求信息
- 響應
- 基本響應
- 重定向
- 其他響應
- 響應宏
- 系統架構
- 服務提供者
- 基本提供者例子
- 注冊提供者
- 緩載提供者
- 服務容器
- 基本用法
- 將接口綁定到實現
- 上下文綁定
- 標簽
- 實際應用
- 容器事件
- 參考:理解PHP 依賴注入|Laravel IoC容器
- Contracts
- 為什么用 Contracts
- Contract 參考
- 如何使用 Contracts
- Facades
- 實際用法
- 建立 Facades
- 模擬 Facades
- Facade 類參考
- 請求的生命周期
- 生命周期概要
- 聚焦于服務提供者
- 應用程序結構
- 根目錄
- App 目錄
- 為應用程序配置命名空間
- 系統服務
- 認證
- 用戶認證
- 取得經過認證的用戶
- 保護路由
- HTTP 基本認證
- 忘記密碼與重設
- 第三方登陸認證
- 交易
- 配置文件
- 訂購方案
- 一次性付款
- Single Charges
- 免信用卡試用
- 訂購轉換
- 訂購數量
- 取消訂購
- 恢復訂購
- 確認訂購狀態
- 處理失敗訂閱
- 處理其它 Stripe Webhooks
- 收據
- 緩存
- 配置
- 緩存用法
- 遞增與遞減
- 緩存標簽
- 緩存事件
- 數據庫緩存
- 集合
- Command Bus
- 建立命令
- 調用命令
- 命令隊列
- 命令管道
- 核心擴展
- 管理者和工廠
- 緩存
- Session
- 認證
- 基于服務容器的擴展
- Laravel Elixir
- 安裝與配置
- 使用方式
- Gulp
- Custom Tasks and Extensions
- 加密
- Envoy 任務執行器
- 安裝
- 執行任務
- 多服務器
- 并行執行
- 任務宏
- 通知
- 更新 Envoy
- 錯誤與日志
- 配置
- 錯誤處理
- HTTP 異常
- 日志
- 事件
- 基本用法
- 事件處理隊列
- 事件訂閱者
- 文件系統與云存儲
- 配置文件
- 基本用法
- 自定義文件系統
- 哈希
- 基本用法
- 輔助方法
- 數組
- 路徑
- 路由
- 字符串
- 網址(URL)
- 其他
- 本地化
- 語言文件
- 基本用法
- 復數
- 驗證
- 覆寫擴展包的語言文件
- 郵件
- 配置
- 基本用法
- 內嵌附件
- 郵件隊列
- 郵件與本地端開發
- 擴展包開發
- 視圖
- 語言
- 配置文件
- 公共資源
- 發布分類文件
- 路由
- 分頁
- 配置
- 使用
- 追加分頁鏈接
- 轉換至 JSON
- 隊列
- 設置
- 基本用法
- 隊列閉包
- 執行一個隊列監聽
- 常駐隊列處理器
- 推送隊列
- 已失敗的工作
- 會話
- 配置
- 使用 Session
- 暫存數據(Flash Data)
- 數據庫 Sessions
- Session 驅動
- 模板
- Blade 模板
- Blade 控制語法結構
- Blade 擴展
- 參考:@section與@yield 介紹
- 單元測試
- 定義并執行測試
- 測試環境
- 從測試調用路由
- 模擬 Facades
- 框架 Assertions
- 輔助方法
- 重置應用程序
- 表單驗證
- 基本用法
- 控制器驗證
- 表單請求驗證
- 使用錯誤信息
- 錯誤信息 & 視圖
- 可用驗證規則
- 條件驗證規則
- 自定義錯誤信息
- 自定義驗證規則
- 數據庫
- 使用基礎
- 配置
- 讀取/寫入連接
- 執行查找
- 數據庫事務處理
- 獲取連接
- 日志記錄
- 查詢構造器
- Selects
- Joins
- 高級 Wheres
- 聚合
- 原生表達式
- 添加
- 更新
- 刪除
- Unions
- 悲觀鎖定 (Pessimistic Locking)
- Eloquent ORM
- 基本用法
- 批量賦值
- 新增,更新,刪除
- 軟刪除
- 時間戳
- 范圍查詢
- Global Scopes
- 關聯
- 關聯查詢
- 預載入
- 新增關聯模型
- 更新上層時間戳
- 使用樞紐表
- 集合
- 獲取器和修改器
- 日期轉換器
- 屬性類型轉換
- 模型事件
- 模型觀察者
- 模型 URL 生成
- 轉換成數組 / JSON
- 結構生成器
- 建立與刪除數據表
- 加入字段
- 修改字段
- 修改字段名稱
- 移除字段
- 檢查是否存在
- 加入索引
- 外鍵
- 移除索引
- 移除時間戳記和軟刪除
- 保存引擎
- 遷移和數據填充
- 建立遷移文件
- 執行遷移
- 回滾遷移
- 數據填充
- Redis
- 配置
- 使用方式
- 管道
- 開發包
- Confide 用戶身份認證
- Entrust 權限管理
- Shoppingcart 購物車
- Genertators 代碼生成工具
- IDE Helper IDE助手
- Artisan 命令行工具
- 概覽
- 用法
- 在命令行接口以外的地方調用命令
- 定時調用 Artisan 命令
- 開發
- 建立自定義命令
- 注冊自定義命令