grunt-email-builder, 在grunt中,构建来自 html/css代码的电子邮件

分享于 

4分钟阅读

GitHub

  繁體 雙語
Build Emails from HTML / CSS code in grunt
  • 源代码名称:grunt-email-builder
  • 源代码网址:http://www.github.com/Email-builder/grunt-email-builder
  • grunt-email-builder源代码文档
  • grunt-email-builder源代码下载
  • Git URL:
    git://www.github.com/Email-builder/grunt-email-builder.git
    Git Clone代码到本地:
    git clone http://www.github.com/Email-builder/grunt-email-builder
    Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/Email-builder/grunt-email-builder
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    
    grunt-email-builder

    npm versionBuild StatusDependency StatusBuilt with GruntGitter

    使用电子邮件生成器插件将css发送到HTML标签,将测试发送到 Litmus,并将测试邮件发送给自己。

    从v3.0.0开始,你将不能再使用 data-ignore 属性。 相反,使用数据属性 data-embeddata-embed-ignore 防止电子邮件生成器内联css样式。

    例如:

    <!DOCTYPE html>
    <html>
    <head>
     <!-- styles will be inlined --> <linkrel="stylesheet"type="text/css"href="../css/styles.css">
     <!-- styles will be embedded --> <linkrel="stylesheet"type="text/css"href="../css/otherStyles.css"data-embed>
     <!-- link tag will be preserved and styles will not be inlined or embedded --> <linkhref='http://fonts.googleapis.com/css?family=Open+Sans'rel='stylesheet'type='text/css'data-embed-ignore>
     <!-- styles will be inlined --> <style>p { color: red; }</style>
     <!-- styles will be embedded --> <styledata-embed>h1 { color: black; }</style>
    </head>
    <body>
     <h1>Heading</h1>
     <p>Body</p>
    </body>
    </html>

    你可以看到一个设置 below的例子

    正在启动

    在你的项目gruntfile插件的旁边安装这个插件插件,其中包括:npm install grunt-email-builder

    然后将这一行添加到你的项目gruntfile的grunt.js 中:

    grunt.loadNpmTasks('grunt-email-builder');

    文档

    将这里放入你的grunt文件。

    emailBuilder: {
     test :{
     files : {
     'dest/ouput.html':'src/input.html' }
     }
    }

    要动态生成文件 ,请执行以下操作:

    files : [{
     expand:true,
     src: ['**/*.html'],
     dest:'dest/',
    }]

    命令行选项

    查看电子邮件生成器选项所有可用选项。

    示例用法

    emailBuilder:{
     inline: {
     files: { 'dest/output.html':'src/input.html' },
     options: {
     encodeSpecialChars:true }
     },
     litmus: {
     files: { 'dest/output.html':'src/input.html' },
     options: {
     encodeSpecialChars:true,
     litmus: {
     username:'username',
     password:'password',
     url:'https://yoursite.litmus.com',
     applications: ['gmailnew', 'ffgmail', 'chromegmail']
     }
     }
     }
    }grunt.registerTask('inline', 'emailBuilder:inline');grunt.registerTask('litmus', 'emailBuilder:litmus');

    故障排除

    如果你有问题,可以永久加载测试或者测试标题显示为"无主题",最可以能是with的问题。 你可以查看状态页面,以了解它们是否有任何问题。 如果不是这样,提交一个问题,我们将进一步探讨。

    代替正式的styleguide,请注意维护现有的编码风格。 为任何新的或者已经更改的功能添加单元测试。 Lint并使用 测试你的代码。

    贡献者

    感谢所有贡献者的帮助。

    进一步阅读

    发行历史记录
    发布v2.0文档文件

    许可证


    相关文章