{"id":13397833,"url":"https://github.com/mjmlio/mjml","last_synced_at":"2025-09-09T21:03:24.646Z","repository":{"id":38343308,"uuid":"50586840","full_name":"mjmlio/mjml","owner":"mjmlio","description":"MJML: the only framework that makes responsive-email easy","archived":false,"fork":false,"pushed_at":"2025-02-20T17:29:39.000Z","size":10587,"stargazers_count":17416,"open_issues_count":71,"forks_count":971,"subscribers_count":169,"default_branch":"master","last_synced_at":"2025-05-05T12:57:30.345Z","etag":null,"topics":["email","email-boilerplate","email-campaigns","mjml","responsive","responsive-email"],"latest_commit_sha":null,"homepage":"https://mjml.io","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mjmlio.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2016-01-28T14:04:05.000Z","updated_at":"2025-05-05T08:37:19.000Z","dependencies_parsed_at":"2024-02-28T12:25:15.039Z","dependency_job_id":"8ce2fc9d-1eb3-4b58-8ec7-f140c78bebf1","html_url":"https://github.com/mjmlio/mjml","commit_stats":{"total_commits":1870,"total_committers":190,"mean_commits":9.842105263157896,"dds":0.7684491978609626,"last_synced_commit":"74b47934d40c67526001e5340648725acc0198e5"},"previous_names":[],"tags_count":128,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjmlio%2Fmjml","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjmlio%2Fmjml/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjmlio%2Fmjml/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjmlio%2Fmjml/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mjmlio","download_url":"https://codeload.github.com/mjmlio/mjml/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252504171,"owners_count":21758654,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["email","email-boilerplate","email-campaigns","mjml","responsive","responsive-email"],"created_at":"2024-07-30T18:01:47.856Z","updated_at":"2025-05-12T16:12:54.607Z","avatar_url":"https://github.com/mjmlio.png","language":"JavaScript","readme":"# MJML 4\n\nIf you're looking for MJML 3.3.X check [this branch](https://github.com/mjmlio/mjml/tree/3.3.x)\n\n\u003cp style=\"text-align: center;\" \u003e\n  \u003ca href=\"https://mjml.io\" target=\"_blank\"\u003e\n    \u003cimg width=\"250\"src=\"https://mjml.io/assets/img/litmus/mjmlbymailjet.png\"\u003e\n\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp style=\"text-align: center;\" \u003e\n  \u003ca href=\"https://github.com/mjmlio/mjml/actions\"\u003e\n    \u003cimg src=\"https://github.com/mjmlio/mjml/workflows/Mjml%20CI/badge.svg?branch=master\" alt=\"github actions\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://www.codacy.com/app/gbadi/mjml\"\u003e\n    \u003cimg src=\"https://api.codacy.com/project/badge/grade/575339cb861f4ff4b0dbb3f9e1759c35\"/\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\n\u003cp style=\"text-align: center;\" \u003e\n  | \u003cb\u003e\u003ca href=\"#translated-documentation\"\u003eTranslated documentation\u003c/a\u003e\u003c/b\u003e\n  | \u003cb\u003e\u003ca href=\"#introduction\"\u003eIntroduction\u003c/a\u003e\u003c/b\u003e\n  | \u003cb\u003e\u003ca href=\"#installation\"\u003eInstallation\u003c/a\u003e\u003c/b\u003e\n  | \u003cb\u003e\u003ca href=\"#usage\"\u003eUsage\u003c/a\u003e\u003c/b\u003e |\n\u003c/p\u003e\n\n---\n# Translated documentation\n\n| Language | Link for documentation |\n| :-: | :-: |\n| 日本語 | [日本語ドキュメント](https://github.com/mjmlio/mjml/blob/master/readme-ja.md) |\n\n# Introduction\n\n`MJML` is a markup language created by [Mailjet](https://www.mailjet.com/) and designed to reduce the pain of coding a responsive email. Its semantic syntax makes the language easy and straightforward while its rich standard components library shortens your development time and lightens your email codebase. MJML’s open-source engine takes care of translating the `MJML` you wrote into responsive HTML.\n\n\u003cp style=\"text-align: center;\" \u003e\n  \u003ca href=\"https://mjml.io\" target=\"_blank\"\u003e\n    \u003cimg width=\"75%\" src=\"https://cloud.githubusercontent.com/assets/6558790/12450760/ee034178-bf85-11e5-9dda-98d0c8f9f8d6.png\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\n# Installation\n\nYou can install `MJML` with `NPM` to use it with NodeJS or the Command Line Interface. If you're not sure what those are, head over to \u003ca href=\"#usage\"\u003eUsage\u003c/a\u003e for other ways to use MJML.\n\n```bash\nnpm install mjml\n```\n\n# Development\n\nTo work on MJML, make changes and create merge requests, download and install [yarn](https://yarnpkg.com/lang/en/docs/install/) for easy development.\n\n```bash\ngit clone https://github.com/mjmlio/mjml.git \u0026\u0026 cd mjml\nyarn\nyarn build\n```\n\nYou can also run `yarn build:watch` to rebuild the package as you code.\n\n# Usage\n\n## Online\n\nDon't want to install anything? Use the free online editor!\n\n\u003cp style=\"text-align: center;\" \u003e\n  \u003ca href=\"https://mjml.io/try-it-live\" target=\"_blank\"\u003e\u003cimg src=\"https://cloud.githubusercontent.com/assets/6558790/12195421/58a40618-b5f7-11e5-9ed3-80463874ab14.png\" alt=\"try it live\" width=\"75%\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\u003cbr\u003e\n\n## Applications and plugins\n\nMJML comes with an ecosystem of tools and plugins, check out:\n- The [MJML App](https://mjmlio.github.io/mjml-app/) (MJML is included)\n- [Visual Studio Code plugin](https://github.com/mjmlio/vscode-mjml) (MJML is included)\n- [Sublime Text plugin](https://packagecontrol.io/packages/MJML-syntax) (MJML needs to be installed separately)\n\nFor more tools, check the [Community](https://mjml.io/community) page.\n\n## Command line interface\n\n\u003e Compiles the file and outputs the HTML generated in `output.html`\n\n```bash\nmjml input.mjml -o output.html\n```\n\nYou can pass optional `arguments` to the CLI and combine them.\n\nargument | description | default value\n---------|--------|--------------\n`mjml -m [input]` | Migrates a v3 MJML file to the v4 syntax | NA\n`mjml [input] -o [output]` | Writes the output to [output] | NA\n`mjml [input] -s` | Writes the output to `stdout` | NA\n`mjml -w [input]` | Watches the changes made to `[input]` (file or folder) | NA\n`mjml [input] --config.beautify` | Beautifies the output (`true` or `false`) | true\n`mjml [input] --config.minify` | Minifies the output (`true` or `false`) | false\n\nSee [mjml-cli documentation](https://github.com/mjmlio/mjml/blob/master/packages/mjml-cli/README.md) for more information about config options.\n\n## Inside Node.js\n\n```javascript\nimport mjml2html from 'mjml'\n\n/*\n  Compile an mjml string\n*/\nconst htmlOutput = mjml2html(`\n  \u003cmjml\u003e\n    \u003cmj-body\u003e\n      \u003cmj-section\u003e\n        \u003cmj-column\u003e\n          \u003cmj-text\u003e\n            Hello World!\n          \u003c/mj-text\u003e\n        \u003c/mj-column\u003e\n      \u003c/mj-section\u003e\n    \u003c/mj-body\u003e\n  \u003c/mjml\u003e\n`, options)\n\n\n/*\n  Print the responsive HTML generated and MJML errors if any\n*/\nconsole.log(htmlOutput)\n```\n\nYou can pass optional `options` as an object to the `mjml2html` function:\n\noption   | unit   | description  | default value\n-------------|--------|--------------|---------------\nfonts  | object | Default fonts imported in the HTML rendered by MJML | See in [index.js](https://github.com/mjmlio/mjml/blob/master/packages/mjml-core/src/index.js#L100-L108)\nkeepComments | boolean | Option to keep comments in the HTML output | true\nignoreIncludes | boolean | Option to ignore mj-includes | false\nbeautify | boolean | Option to beautify the HTML output | false\nminify | boolean | Option to minify the HTML output | false\nvalidationLevel | string | Available values for the [validator](https://github.com/mjmlio/mjml/tree/master/packages/mjml-validator#validating-mjml): 'strict', 'soft', 'skip'  | 'soft'\nfilePath | string | Path of file, used for relative paths in mj-includes | '.'\npreprocessors | array of functions | Preprocessors applied to the xml before parsing. Input must be xml, not json. Functions must be (xml: string) =\u003e string | []\njuicePreserveTags | Preserve some tags when inlining css, see [mjml-cli documentation](https://github.com/mjmlio/mjml/blob/master/packages/mjml-cli/README.md) for more info | NA\nminifyOptions | Options for html minifier, see [mjml-cli documentation](https://github.com/mjmlio/mjml/blob/master/packages/mjml-cli/README.md) for more info | NA\nmjmlConfigPath | string | The path or directory of the `.mjmlconfig` file (for custom components use) | `process.cwd()`\nuseMjmlConfigOptions | Allows to use the `options` attribute from `.mjmlconfig` file | false\n\n## Client-side (in browser)\n\n```javascript\nvar mjml2html = require('mjml-browser')\n\n/*\n  Compile a mjml string\n*/\nvar htmlOutput = mjml2html(`\n  \u003cmjml\u003e\n    \u003cmj-body\u003e\n      \u003cmj-section\u003e\n        \u003cmj-column\u003e\n          \u003cmj-text\u003e\n            Hello World!\n          \u003c/mj-text\u003e\n        \u003c/mj-column\u003e\n      \u003c/mj-section\u003e\n    \u003c/mj-body\u003e\n  \u003c/mjml\u003e\n`, options)\n\n\n/*\n  Print the responsive HTML generated and MJML errors if any\n*/\nconsole.log(htmlOutput)\n```\n\n## API\n\nA free-to-use MJML API is available to make it easy to integrate MJML in your application. Head over [here](https://mjml.io/api) to learn more about the API.\n\n# MJML Slack\n\nMJML wouldn't be as cool without its amazing community. Head over the [Community Slack](https://join.slack.com/t/mjml/shared_invite/zt-gqmwfwmr-kPBnfuuB7wof5httaTcXxg) to meet fellow MJML'ers.\n\n# Contributors\n\n- [Maxime](https://github.com/iRyusa)\n- [Nicolas](https://github.com/ngarnier)\n- [Cedric](https://github.com/kmcb777)\n- [Loeck](https://github.com/lohek)\n- [Robin](https://github.com/robink)\n- [Guillaume](https://github.com/GuillaumeBadi)\n- [Meriadec](https://github.com/meriadec)\n- [Arnaud](https://github.com/arnaudbreton)\n- [HTeuMeuLeu](https://github.com/hteumeuleu)\n- [Emmanuel Payet](https://github.com/epayet)\n- [Matthieu](https://github.com/swibge)\n- [Rogier](https://github.com/rogierslag)\n","funding_links":[],"categories":["JavaScript","Packages","Mailing","Repository","包","Github Repositories","Code","目录","Libraries","others","Uncategorized","Developer Tools","工具","SEO"],"sub_categories":["Email","电子邮件","Frontend Development","Framework","邮箱","Uncategorized","Developer Utilities","邮件","调试"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmjmlio%2Fmjml","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmjmlio%2Fmjml","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmjmlio%2Fmjml/lists"}