Làm cách nào để chạy kết hợp trong Laravel?

Winter mang đến sự hỗ trợ hạng nhất để xử lý quá trình biên dịch dựa trên Nút cho nội dung giao diện người dùng thông qua các lệnh Mix. Các comamnd sử dụng trình bao bọc Laravel Mix, một giao diện đơn giản và thân thiện với người dùng để thiết lập biên dịch nhiều loại nội dung giao diện người dùng thông qua Webpack và các thư viện khác nhau

Yêu cầu

Để tận dụng lợi thế của trình biên dịch nội dung Mix, bạn phải cài đặt Node và trình quản lý gói Node (NPM) trong môi trường phát triển của mình. Điều này sẽ phụ thuộc vào hệ điều hành của bạn - vui lòng xem lại trang Tải xuống NodeJS để biết thêm thông tin về cách cài đặt Node

Laravel Mix cũng phải có trong tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

7 cho bất kỳ gói nào sẽ sử dụng nó (trong

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

8 hoặc

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

9) nhưng nếu nó không được chỉ định trong tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

7 của dự án thì nó có thể được thêm tự động tùy chọn khi chạy lệnh

Đăng ký một gói

Đăng ký tổng hợp nội dung thông qua Mix rất dễ dàng. Đăng ký tự động sẽ đáp ứng nhu cầu của bạn hầu hết thời gian và nếu không, có một số phương pháp có sẵn để đăng ký gói Mix theo cách thủ công

đăng ký tự động

Theo mặc định, Winter sẽ quét tất cả các mô-đun, plugin và chủ đề có sẵn và đã bật để tìm tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2 trong thư mục gốc của mỗi tiện ích mở rộng (i. e.

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

3,

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

4 hoặc

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

5)

Nếu tìm thấy tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2, nó sẽ tự động được đăng ký dưới dạng gói có tên gói được tạo tự động và sẽ hiển thị khi chạy các lệnh Trộn. Hầu hết thời gian, đây sẽ là tất cả những gì bạn cần làm để bắt đầu biên dịch nội dung Laravel Mix trong Winter CMS

Đăng ký plugin

Để đăng ký nội dung giao diện người dùng được biên dịch thông qua Mix trong plugin của bạn, chỉ cần trả về một mảng có tên gói làm khóa và đường dẫn gói liên quan đến thư mục plugin làm giá trị để đăng ký từ phương thức

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

8 của tệp đăng ký

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

7 của bạn. Xem ví dụ bên dưới

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

1

Đăng ký chủ đề

Việc đăng ký tài sản tổng hợp các chủ đề thậm chí còn dễ dàng hơn và có thể được thực hiện bằng cách thêm định nghĩa

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

9 vào (

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

30) của bạn

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

Định nghĩa

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

9 lấy bất kỳ số lượng gói đã đăng ký nào làm đối tượng YAML, với khóa là tên của gói dưới dạng chuỗi kebab-case và vị trí tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2 của bạn so với thư mục gốc của chủ đề

Ví dụ: nếu bạn muốn đăng ký hai gói tên là

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

33 và

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

34 nằm trong thư mục nội dung, bạn sẽ sử dụng định nghĩa sau

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

trộn cấu hình

Tệp cấu hình Mix (

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2) là tệp cấu hình quản lý cấu hình của chính Laravel Mix. Cùng với tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

7 xác định các phụ thuộc của bạn, tệp này xác định cách Laravel Mix sẽ biên dịch nội dung của bạn

Bạn có thể xem lại các ví dụ hoặc Mix API đầy đủ tại trang web Laravel Mix

Tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2 của bạn phải bao gồm Trộn theo yêu cầu và cũng phải xác định đường dẫn công khai đến thư mục hiện tại, như sau

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

3

đường dẫn

Khi tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2 được đánh giá, bất kể bạn đã chạy

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

39 từ đâu, thư mục làm việc được đặt thành thư mục mẹ của tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2. Điều đó có nghĩa là bất kỳ đường dẫn tương đối nào được sử dụng trong cấu hình sẽ liên quan đến thư mục hiện tại của tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2

GHI CHÚ. Winter's cũng được hỗ trợ trong tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2

ví dụ

Dưới đây là một số ví dụ về cách cài đặt các thư viện lối vào phổ biến để sử dụng với quá trình biên dịch nội dung

CSS đuôi gió

Đối với các chủ đề muốn sử dụng Tailwind CSS, hãy bao gồm các thành phần phụ thuộc

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

93,

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

94 và

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

95 trong tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

7 của bạn

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

9

Thao tác này sẽ tạo một tệp cấu hình Tailwind (

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

97) bên trong chủ đề của bạn mà bạn có thể định cấu hình theo nhu cầu của chủ đề cụ thể của mình

Sau đó, thêm tệp cấu hình

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2 sẽ biên dịch Tailwind khi cần

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

6

Trong ví dụ trên, chúng ta có một tệp CSS cơ sở chứa kiểu dáng Tailwind -

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

99 - tệp này sẽ biên dịch thành tệp CSS được biên dịch cuối cùng trong

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

60

Chủ đề của bạn hiện đã sẵn sàng để phát triển CSS Tailwind

Vue

Nếu bạn muốn sử dụng Vue 3 trong dự án của mình, trong phần phụ trợ hoặc trong một thành phần hoặc chủ đề, bạn có thể làm theo các bước sau

Đầu tiên, xác định Vue là một phụ thuộc trong plugin của bạn

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

7

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

0

Chạy

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

62 để cài đặt Vue và các phụ thuộc mà Vue yêu cầu

Sau đó, thêm tệp cấu hình

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

2 vào thư mục plugin của bạn. Thao tác này sẽ tạo một tệp điểm đầu vào cụ thể, trong trường hợp này là

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

64 và tạo phiên bản dựng sẵn của ứng dụng Vue của bạn dưới dạng

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

65

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

5

Tiếp theo, bạn có thể tạo các tệp nguồn Vue của mình trong thư mục nội dung của plugin. Mix hỗ trợ kết xuất các thành phần tệp đơn, cho phép bạn xác định mẫu, tập lệnh và tạo kiểu tất cả trong một tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

6

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

7

Bây giờ nếu bạn hoàn thành nội dung của mình trong thư mục gốc của dự án với ________ 366, Mix sẽ tạo thành phần Vue được biên dịch và xây dựng của bạn dưới dạng tệp JS

Tiếp theo trong tệp mẫu của bộ điều khiển của bạn (ví dụ:. bộ điều khiển/myvuecontroller/index. php), bạn có thể bao gồm tệp

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

67 đã tạo và hiển thị nội dung trong div với thuộc tính

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

68

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

0

lệnh

Cài đặt phụ thuộc nút

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

1

Lệnh

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

1 sẽ cài đặt các phụ thuộc Node cho tất cả các gói Mix đã đăng ký

Lệnh này sẽ thêm từng gói đã đăng ký vào thuộc tính

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

00 của tệp gốc

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

7 của bạn, sau đó chạy và hiển thị kết quả của

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

02 từ gốc dự án của bạn để cài đặt tất cả các phụ thuộc cho tất cả các gói đã đăng ký cùng một lúc

Bạn có thể tùy chọn cung cấp cờ

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

03 hoặc

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

04 để cài đặt các phụ thuộc cho một hoặc nhiều gói. Để xác định nhiều gói, chỉ cần thêm nhiều cờ

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

03 vào cuối lệnh

Nếu lệnh được chạy với cờ

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

03 hoặc

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

04 và tên gói được cung cấp chưa được đăng ký và tên này khớp với tên gói mô-đun, plugin hoặc chủ đề hợp lệ (mô-đun có tiền tố là

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

08, chủ đề có tiền tố là

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

09 và plugin có tiền tố là

Cờ

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

52 cũng có thể được cung cấp nếu bạn có đường dẫn tùy chỉnh đến chương trình

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

53. Nếu điều này không được cung cấp, hệ thống sẽ cố gắng đoán vị trí của

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

53

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

2

Lệnh

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

55 sẽ cập nhật các phụ thuộc Node cho tất cả các gói Mix đã đăng ký

Lệnh này hoạt động rất giống với

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

1, ngoại trừ việc nó chỉ cập nhật các gói đã cài đặt trước đó. Điều này cho phép bạn luôn cập nhật các phụ thuộc, đặc biệt trong trường hợp sửa lỗi bảo mật hoặc phá vỡ các bản cập nhật từ các phụ thuộc Node của bạn

Vui lòng xem tài liệu

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

1 để biết các đối số và tùy chọn có sẵn

Liệt kê các gói Mix đã đăng ký

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

3

Lệnh

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

58 sẽ liệt kê tất cả các gói Mix đã đăng ký được tìm thấy trong bản cài đặt Winter. Điều này hữu ích để xác định xem plugin hoặc chủ đề của bạn có được đăng ký chính xác hay không

Lệnh sẽ liệt kê tất cả các gói, cũng như thư mục cho nội dung và tệp cấu hình đã được xác định trong quá trình đăng ký

Biên dịch gói Mix

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

4

Lệnh

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

39 biên dịch tất cả các gói Mix đã đăng ký, chạy từng gói thông qua Laravel Mix để biên dịch

Bằng cách chỉ định cờ

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

03, bạn có thể biên dịch một hoặc nhiều gói đã chọn. Để xác định nhiều gói, chỉ cần thêm nhiều cờ

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

03 vào cuối lệnh

Theo mặc định, tất cả các gói được xây dựng ở chế độ "phát triển". Nếu bạn muốn biên dịch ở chế độ "sản xuất", chế độ này có thể bao gồm nhiều tối ưu hóa hơn cho các trang sản xuất, hãy thêm cờ

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

62 hoặc

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

63 vào lệnh

Lệnh sẽ tạo một báo cáo về tất cả các tệp đã biên dịch và kích thước cuối cùng của chúng sau khi hoàn tất

Nếu bạn muốn chuyển các tùy chọn bổ sung cho Webpack CLI, đối với các trường hợp biên dịch đặc biệt, bạn có thể thêm

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

64 vào cuối lệnh, theo sau là bất kỳ tham số nào theo tùy chọn CLI của Webpack

Xem một gói Mix

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

5

Lệnh

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    demo-theme-style: assets/style/winter.mix.js
    demo-theme-shop: assets/shop/winter.mix.js

65 tương tự như lệnh

name: "Winter CMS Demo"
description: "Demonstrates the basic concepts of the frontend theming."
author: "Winter CMS"
homepage: "https://wintercms.com"
code: "demo"

mix:
    : winter.mix.js

39, ngoại trừ việc nó vẫn hoạt động và theo dõi mọi thay đổi được thực hiện đối với các tệp sẽ bị ảnh hưởng bởi quá trình biên dịch của bạn. Khi có bất kỳ thay đổi nào, quá trình biên dịch sẽ tự động được thực thi. Điều này hữu ích cho sự phát triển trong việc cho phép bạn nhanh chóng thực hiện các thay đổi và xem lại chúng trong trình duyệt của mình

Trộn () trong Laravel là gì?

Làm cách nào để sử dụng webpack mix Laravel?

Làm cách nào để trộn CSS trong Laravel?

Làm cách nào để chạy cài đặt npm trong Laravel?