search

markdown-it / markdown-it-emoji

Emoji syntax plugin for markdown-it markdown parser
https://markdown-it.github.io/
MIT License
719 stars 167 forks source link

No effect #21

Closed printjs closed 7 years ago

printjs commented 7 years ago

code:

  <script type="text/javascript" src="./node_modules/markdown-it/dist/markdown-it.js"></script>
  <script type="text/javascript" src="./node_modules/markdown-it-emoji/dist/markdown-it-emoji.min.js"></script>

<script>
var md = window.markdownit({
              html:         true,        // Enable HTML tags in source
              xhtmlOut:     false,        // Use '/' to close single tags (<br />).
                                          // This is only for full CommonMark compatibility.
              breaks:       false,        // Convert '\n' in paragraphs into <br>
              langPrefix:   'language-',  // CSS language prefix for fenced blocks. Can be
                                          // useful for external highlighters.
              linkify:      false,        // Autoconvert URL-like text to links

              // Enable some language-neutral replacement + quotes beautification
              typographer:  false,

              // Double + single quotes replacement pairs, when typographer enabled,
              // and smartquotes on. Could be either a String or an Array.
              //
              // For example, you can use '«»„“' for Russian, '„“‚‘' for German,
              // and ['«\xA0', '\xA0»', '‹\xA0', '\xA0›'] for French (including nbsp).
              quotes: '“”‘’',

              // Highlighter function. Should return escaped HTML,
              // or '' if the source string is not changed and should be escaped externaly.
              // If result starts with <pre... internal wrapper is skipped.
              highlight: function (/*str, lang*/) { return ''; }
            }).use(window.markdownitEmoji);

      md.renderer.rules.emoji = function(token, idx) {
        return '<span class="emoji emoji_' + token[idx].markup + '"></span>';
      };
</script>

The above code has no effect, why?

puzrin commented 7 years ago

This works as expected:

<body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/8.2.2/markdown-it.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it-emoji/1.3.0/markdown-it-emoji.min.js"></script>
<script>
var md = window.markdownit({
  html:         true,        // Enable HTML tags in source
  xhtmlOut:     false,        // Use '/' to close single tags (<br />).
                              // This is only for full CommonMark compatibility.
  breaks:       false,        // Convert '\n' in paragraphs into <br>
  langPrefix:   'language-',  // CSS language prefix for fenced blocks. Can be
                              // useful for external highlighters.
  linkify:      false,        // Autoconvert URL-like text to links

  // Enable some language-neutral replacement + quotes beautification
  typographer:  false,

  // Double + single quotes replacement pairs, when typographer enabled,
  // and smartquotes on. Could be either a String or an Array.
  //
  // For example, you can use '«»„“' for Russian, '„“‚‘' for German,
  // and ['«\xA0', '\xA0»', '‹\xA0', '\xA0›'] for French (including nbsp).
  quotes: '“”‘’',

  // Highlighter function. Should return escaped HTML,
  // or '' if the source string is not changed and should be escaped externaly.
  // If result starts with <pre... internal wrapper is skipped.
  highlight: function (/*str, lang*/) { return ''; }
}).use(window.markdownitEmoji);

md.renderer.rules.emoji = function(token, idx) {
  return '<span class="emoji emoji_' + token[idx].markup + '"></span>';
};

console.log(md.render('foo :)'));
</script>
</body>

console:

<p>foo <span class="emoji emoji_smiley"></span></p>

I just copied your code, replaced urls and called .render(text)