我無法在我的郵件刀片中制作作業風格。
最終目標是有一個郵件布局。到目前為止,為了測驗目的,我有:
- 發送郵件的控制器
- 郵件組件
- 可郵寄類
- 電子郵件的布局,作為 guest.blade.php jetstream 檔案的副本
- 一個特定的電子郵件刀片檔案,即要添加到以前布局中的內容,是welcome.blade.php jetstream 檔案的副本
app\Http\Controllers\TestController.php
<?php
namespace App\Http\Controllers;
use App\Mail\TestingMail;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Mail;
class TestController extends Controller
{
public function __invoke(Request $request)
{
$result = Mail::to($request->user())
->send(new TestingMail());
return view('welcome');
}
}
app\View\Components\MailLayout.php
<?php
namespace App\View\Components;
use Illuminate\View\Component;
class MailLayout extends Component
{
/**
* Create a new component instance.
*
* @return void
*/
public function __construct()
{
//
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|\Closure|string
*/
public function render()
{
return view('layouts.mail');
}
}
應用\郵件\TestingMail.php
<?php
namespace App\Mail;
use Illuminate\Bus\Queueable;
use Illuminate\Mail\Mailable;
use Illuminate\Queue\SerializesModels;
class TestingMail extends Mailable
{
use Queueable, SerializesModels;
/**
* Create a new message instance.
*
* @return void
*/
public function __construct()
{
//
}
/**
* Build the message.
*
* @return $this
*/
public function build()
{
return $this->view('mails.general');
}
}
資源\視圖\布局\mail.blade.php
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Fonts -->
<link rel="stylesheet" href="https://fonts.bunny.net/css2?family=Nunito:wght@400;600;700&display=swap">
<!-- Scripts -->
@vite(['resources/css/app.scss', 'resources/js/app.js'])
</head>
<body>
<div class="font-sans text-gray-900 antialiased">
{{ $slot }}
</div>
</body>
</html>
資源\視圖\郵件\general.blade.php
<x-mail-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
{{ __('Dashboard') }}
</h2>
</x-slot>
<div class="py-12">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg">
<x-jet-welcome />
</div>
</div>
</div>
</x-mail-layout>
我收到沒有樣式的郵件。我發現的唯一幫助是這個鏈接https://ralphjsmit.com/tailwind-css-multiple-configurations-laravel-mix但這是為 laravel mix 撰寫的,我不知道要遷移這個 webpack.mix.js邀請。
任何幫助或指導將不勝感激,謝謝。
編輯 我最終使它作業,結合@Jaap的答案和其他包: https ://github.com/fedeisas/laravel-mail-css-inliner
https://github.com/motomedialab/laravel-vite-helper
vite helper 并不理想,因為它在 npm run dev 運行時不起作用,但對我來說已經足夠了。
uj5u.com熱心網友回復:
對于您希望行內樣式的電子郵件。我不認為這是 Vite、Tailwind 或 Blade 開箱即用的功能。
但是,有一個包似乎可以解決您的問題:https ://github.com/fedeisas/laravel-mail-css-inliner
以前從未嘗試過,但它似乎很活躍。然而,自動行內的做法對于電子郵件來說是很常見的,所以谷歌就可以找到那個。您可能會找到一些適合您需要的軟體包。
uj5u.com熱心網友回復:
您必須先構建 vite 檔案 ( npm run build),然后將它們包含在您的郵件模板中。或者您可以將它們行內在一個大塊中<style>。
如果您想要一個更好的示例,請查看如何welcome.blade.php在全新的 Laravel 安裝中執行此操作。
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/504295.html
