資訊專欄INFORMATION COLUMN
摘要：之前的版本用的管理全段資源，版本開始使用的來管理。不過，并不是強制要求在開發期間使用它。發布問題標題標題編輯器容器內容發布問題實例化編輯器設置如果沒有預加載，否則不會出現
一、簡介Laravel5.4 之前的版本用 gulp 的 laravel-elixir管理全段資源，Laravel5.4 版本開始使用webpack 的 Laravel Mix 來管理。
Laravel Mix 提供了一套流式 API，使用一些通用的 CSS 和 JavaScript 預處理器為 Laravel 應用定義 Webpack 構建步驟。通過簡單的方法鏈，你可以流式定義資源管道。例如：
mix.js("resources/assets/js/app.js", "public/js")
.sass("resources/assets/sass/app.scss", "public/css");
如果你對如何開始使用 Webpack 和前端資源編譯感到困惑，那么你會愛上 Laravel Mix。不過，并不是強制要求在開發期間使用它。你可以自由選擇使用任何前端資源管道工具，或者壓根不使用。
二、webpack用法Mix 是位于 Webpack 頂層的配置層，所以要運行 Mix 任務你只需要在運行包含在默認 package.json 文件中的其中某個 NPM 腳本即可：
// 1.安裝package.json 包 npm install // 2.運行所有 Mix 任務... npm run dev // 運行所有 Mix 任務并減少輸出... // npm run production // 3.監控前端資源改變 npm run watch
監控前端資源改變
npm run watch 命令將會持續在終端運行并監聽所有相關文件的修改，Webpack將會在發現修改后自動重新編譯資源文件：
npm run watch
webpack.mix.js 添加版本
const { mix } = require("laravel-mix");
mix.js("resources/assets/js/app.js", "public/js")
.sass("resources/assets/sass/app.scss", "public/css")
.version();
前端app.blade.php引入資源方法修改：
三、Laravel-elixir
舊版本用的是laravel-elixir處理的，只需執行gulp命令即可整合前端的資源
gulpfile.js為入口文件
var elixir = require("laravel-elixir");
/*
|--------------------------------------------------------------------------
| Elixir Asset Management
|--------------------------------------------------------------------------
|
| Elixir provides a clean, fluent API for defining some basic Gulp tasks
| for your Laravel application. By default, we are compiling the Sass
| file for our application, as well as publishing vendor resources.
|
*/
elixir(function(mix) {
mix.sass("app.scss")
.browserify("app.js");
mix.version(["js/app.js", "css/app.css"])
});
如果運行該命令后，全端資源有緩存影響，我們可以在上邊的配置文件中，對輸出的資源加版本：
mix.version(["app.js", "app.css"])
在前端 HTML 頁面引入打包后的 css 或 js 資源時，可以用全局的方法 elixir這樣寫：
//
//
然后再執行gulp命令：
gulp實例應用
在 laravel5.4 中應用 select2 插件:
將 select2.min.css 和 select2.min.js文件經過 gulp編譯后生成app.css 和 app.js打包后的文件,然后在總視圖布局文件/layouts/app.blade.php中應用，
{{ config("app.name", "Laravel") }}
@include("shared.messages")
@yield("content")
@yield("js")
在底部引用app.js代碼，并添加區塊布局 yield("js"),在繼承該總布局頁面時，有關應用js代碼的需要放在 @section("js") 如select2 @endsection中，如下面的這個子頁面 create.blade.php。
@extends("layouts.app")
@section("content")
@include("vendor.ueditor.assets")
發布問題
@include("shared.errors")
@section("js")
@endsection
@endsection
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/22516.html
本文來自pilishen.com----原文鏈接; 歡迎作客我們的php&Laravel學習群：109256050《Npm Debug Series》是我們課程laravel實戰實戰系列課程的擴展閱讀篇，雖然視頻中我們已經將npm install過程中的常見問題及解決方案都說了，但是鑒于npm的問題相對頻繁，有隨時查閱之需，故有此系列文章。 最近很多小伙伴在使用最新的laravel5.4來學習我...
摘要：本節將學習是如何利用形成一套完整的前端工作流模式的。你也可以使用下面命令來強制安裝所有模塊，不管該模塊之前是否安裝過由于國內墻的原因，使用安裝會非常緩慢，慢到想切，不過還好，我們可以使用淘寶提供的國內鏡像進行下載。 本節將學習 Laravel 是如何利用 Sass, NPM, Gulp形成一套完整的前端工作流模式的。 一、句法強大的樣式表Sass Sass 是一種可用于編寫CSS的語言...
摘要：本文整理上國內相對較常用及以上版本的擴展包代碼生成文檔對象云存儲文檔消息閃存文檔編輯器代碼提示文檔文檔文檔圖片處理文檔微信開發文檔語言包文檔驗證碼文檔社會化登陸文檔系統日志文檔前端構建工具文檔跨域資源共享文檔基于的用戶認 本文整理Github上國內相對較常用Laravel5及以上版本的擴展包 laravel-generator（代碼生成） Github：https://github....
摘要：本文整理上國內相對較常用及以上版本的擴展包代碼生成文檔對象云存儲文檔消息閃存文檔編輯器代碼提示文檔文檔文檔圖片處理文檔微信開發文檔語言包文檔驗證碼文檔社會化登陸文檔系統日志文檔前端構建工具文檔跨域資源共享文檔基于的用戶認 本文整理Github上國內相對較常用Laravel5及以上版本的擴展包 laravel-generator（代碼生成） Github：https://github....
摘要：本文整理上國內相對較常用及以上版本的擴展包代碼生成文檔對象云存儲文檔消息閃存文檔編輯器代碼提示文檔文檔文檔圖片處理文檔微信開發文檔語言包文檔驗證碼文檔社會化登陸文檔系統日志文檔前端構建工具文檔跨域資源共享文檔基于的用戶認 本文整理Github上國內相對較常用Laravel5及以上版本的擴展包 laravel-generator（代碼生成） Github：https://github....
閱讀 2924·2021-11-23 09:51
閱讀 3099·2021-11-15 11:39
閱讀 2979·2021-11-09 09:47
閱讀 2527·2019-08-30 13:49
閱讀 2113·2019-08-30 13:09
閱讀 3092·2019-08-29 16:10
閱讀 3504·2019-08-26 17:04
閱讀 984·2019-08-26 13:57
