首頁 > 服務 > Laravel Mix > LiveReload

LiveReload

使用 Live Reload 可以在我們異動 css 的時候，自動幫我們重新在瀏覽器重新刷新頁面，這樣我們在做畫面設計的時候，就可以更快的設計除錯

安裝 webpack-livereload-plugin

npm install webpack-livereload-plugin@1 --save-dev

設定 webpack.mix.js

var LiveReloadPlugin = require('webpack-livereload-plugin');

// LiveReload 設定
mix.webpackConfig({
    plugins: [
        new LiveReloadPlugin()
    ]
});

// 產生 sass 檔案
mix.sass('public/assets/scss/app.scss', 'public/assets/css/');

安裝 Chrome LiveReload 套件

在 LiveReload - Chrome 線上應用程式商店安裝此套件

設定 LiveReload 至 blade 樣板

@if(config('app.env') == 'local')
    <script src="http://localhost:35729/livereload.js"></script>
@endif

監控 LiveReload 運作

npm run watch

參考資料

KeJyun 最新新書推薦
- Laravel 5 for beginner 新手道場：優雅運用框架快速開發 PHP 網站
- Laravel框架开发详解：从零基础到运用框架快速开发PHP网站

Laravel 是 PHP 的框架（Framework），提供了很多開發網站或 API 所需的工具及環境，經過簡單的設定就可以完成資料的處理及顯示，使開發者可以很優雅且快速的開發出各個不同的產品。本書適合有 PHP 基礎的人，但不知道要怎麼選擇框架，或者不用框架的人也能夠明白它的好處。

雖然 WordPress 也能夠架站，但如果有客製化需求，要開發各式各樣的網站，或提供 App 使用的 API，如此一來你只能選擇用框架，而 Laravel 是目前最受歡迎的。

本書將解說為什麼要使用框架，以及理解框架的優缺點後，要怎麼選擇框架，並用框架快速建構一個網站。除非必要，否則書中會避免專業技術用語，盡量使用最生活化易懂的例子及語氣，讓大家更容易進入 Laravel 的世界。

Laravel 5 for beginner 新手道場：優雅運用框架快速開發 PHP 網站

購書連結