Hexo: my <style> element in markdown is parsed unexpectedly.

[lzl124631x]

Environment Info

Node version(node -v): v8.9.1

Your site _config.yml (Optional):

Your theme _config.yml (Optional):

Hexo and Plugin version(npm ls --depth 0):
[email protected] C:\Richard\Project\lzl124631x.github.io
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]

For question

I have some <style> elements in side of my markdown. They are parsed by hexo which results in broken page:

<style><br>.droplet {<br>  display: inline-block;<br>  width: 4em;<br>  height: 4em;<br> 

Can I disable this behavior?

[NoahDragon]

Not sure how this happened. Does it happen recently?

[lzl124631x]

@NoahDragon Yes, it just happened last week. This is not by design? I'll verify this again later.

[tcrowe]

@lzl124631x Would you be able to see if you have any of the marked: options set in your _config.yml please? https://github.com/hexojs/hexo-renderer-marked#options

Thanks!

[lzl124631x]

@tcrowe
There is no maked field in my _config.yml.

I downgraded my node version. This is my updated environment.

$ npm -v
2.15.11
$ node -v
v4.8.6
$ npm ls --depth 0 | grep hexo
[email protected] C:\Richard\Project\lzl124631x.github.io
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]

And the problem is automatically gone. Not sure if it's caused by the latest version of node (at least it caused me some error in gulp)

[lzl124631x]

Hi, @NoahDragon @tcrowe Sorry, I met this same problem again.

There is no marked config in my _config.yml.

Broken post examples:
First one: The first <style> is intact, but the second <style> styling .heart is translated to <style><br>.heart {<br> display: block;<br>. What is expected

Second one: I got <style></p><p>#table1 {<br> border-co. What is expected

Note that I'm migrating from jekyll to hexo, so my blog is still jekyll now.

[stale[bot]]

This issue has been automatically marked as stale because lack of recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[lzl124631x]

@NoahDragon @tcrowe soft ping.

[tcrowe]

Hey @lzl124631x I did a quick test:

mkdir style-test
cd style-test
hexo init
# add style code
hexo clean && hexo serve --debug

Style code:

<style>
.droplet {
  display: inline-block;
  width: 4em;
  height: 4em;
}
</style>

<div class="droplet">
  droplet class example
</div>

This did not yield the result you mentioned.

style-test›npm ls --depth 0
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

style-test›node -v && npm -v
v8.9.4
5.6.0

[tcrowe]

[tcrowe]

Landscape theme ⬆️

[stale[bot]]

This issue has been automatically marked as stale because lack of recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[lzl124631x]

@tcrowe Thanks for your update. I just had a try and still had problem. This post can repro this problem. The droplet part worked fine now but the heart part still doesn't work.

This is what I got with Jekyll. You can see the heart is beating.

But in hexo I got

Oh wait. I found that I have to put an empty line after <style>...</style> and before <span class="heart beating"></span> in hexo. But in jekyll I don't have to do it. Do you know why?

[stale[bot]]

This issue has been automatically marked as stale because lack of recent activity. It will be closed if no further activity occurs. Thank you for your contributions.