概要
OutlookのレンダリングエンジンがEdgeになるみたいですが、まだまだ、テーブルコーディング、インラインCSSが主流でコーディングが面倒で悩まされます。
今回はメルマガのHTMLメール用のコーディングをする際に、埋め込みCSS（styleタグ内）でコーディングして、後からインラインCSSに変換します。
環境構築
node.jsで環境を構築します。
package.json
使用モジュールは下記になります。
- fs …ファイル操作モジュール（HTML読み込み・保存）
- juice …インラインCSS変換モジュール
{
"name": "mail_mag_test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "node conv.js"
},
"author": "",
"license": "ISC",
"devDependencies": {
"fs": "^0.0.1-security",
"juice": "^9.1.0"
}
}モジュールインストール
npm installスクリプト
let fs = require('fs');
let juice = require('juice');
let source = fs.readFileSync('./htdocs/index1.html', 'utf-8');
let inlinecss = juice(source, {
removeStyleTags: false,
preserveImportant: true,
});
fs.writeFile('./htdocs/index.html', inlinecss, (err) => {
if (err) throw err;
console.log('正常に書き込みが完了しました');
});オプションはドキュメントを確認ください。
変換
node conv.js
コメントを投稿する