如何在 Laravel 下安裝最新版的 Elixir

如何在 Laravel 下安裝最新版的 Elixir

2016-01-10 Tags: Laravel 5.0 npm

在 Laravel 「前端」開發流程中,Elixir 佔了一個很重要的角色。Elixir 是一個 Node.js 模組,安裝後會存放在每個 Laravel 專案資料夾內的 node_modules。它提供了一組更簡單的 API 指令來執行 Gulp 前端工作管理器,可自動化處理 Sass/SCSS/Less 的編譯、CSS 的合併、JavaScript 的合併、將 CSS/JavaScript 會用到的資源檔 (如:JS檔、圖檔、字型檔) 複製到 public 資料夾下......等基本卻繁瑣的任務,讓前端開發流程更順暢。 

雖然現在 Laravel 已經推出 5.2 版,但是在建置 Laravel 專案時,專案團隊可能會受限於不同的上線環境 (如:較低版本的 PHP),而須採用較早版本的 Laravel (如: Laravel 5.0)。但是如果根據 Laravel 5.0 官方手冊的步驟安裝 Elixir,可能會安裝到舊版的 Elixir。為了確保執行最新版,我們可先到 GitHub 去看一下目前的 Elixir 版本是多少。我們看到最新版的 Elixir 是 4.0 版。所以,我們需要修改 Laravel 5.0 的專案資料夾下的 package.json,告訴 npm 我們要安裝這個版本 (含以後的版本) 的 Elixir。

打開:package.json

{
  "private": true,
  "devDependencies": {
    "gulp": "^3.8.8",
    "laravel-elixir": "*"
  }
}

修改:package.json 

{
  "private": true,
  "devDependencies": {
    "gulp": "^3.8.8",
    "laravel-elixir": "^4.0.0",
  }
}

為了接下來能順利安裝 Elixir,你的電腦裡必須要能執行 npm (Node.js 套件管理器) 指令。我們可以透過以下方法測試。

在終端機 (命令提示字元) 輸入:

npm -v

如果畫面顯示版本訊息 (如:2.14.12),表示可以繼續以下的安裝步驟。如果畫面顯示找不到指令,或者是錯誤訊息,請確保你的電腦上已經正確安裝好「最新版」的 Node.js。

最後一步就是安裝 Elixir 最新版了。 

在終端機 (命令提示字元) 輸入:

npm install

之後就可以繼續使用 gulp 指令自動化編譯、合併、組織前端的資源檔了。

 






陳聖博

最大的樂趣,就是研究那浩瀚無邊的網頁設計與開發技術。也是一個文字過動兒。如果能夠將研究的新技術做出作品,並透過文章記錄與他人分享,是此生最大的成就感。