Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Compiling Vue component fails when markdown includes invalid Vue syntax #4

Closed
anthonygore opened this issue Oct 15, 2018 · 8 comments
Closed

Compiling Vue component fails when markdown includes invalid Vue syntax #4

anthonygore opened this issue Oct 15, 2018 · 8 comments

Comments

@anthonygore
Copy link

anthonygore commented Oct 15, 2018 •
edited
Loading

Hi! Thanks for making this brilliant tool, I'm currently using it in a Nuxt.js project.

I've found a bug, though. If my markdown includes code examples which are considered invalid Vue syntax an error is thrown.

For example:

```html<div>{{test->()}}</div>```

This will crash the compiler.

The thing is, that code is not Vue syntax, it's Laravel Blade syntax, but I think the compiler is confused and thinks it is maybe??? This only happens when vue is set to true in options.

Is there anyway to fix this or perhaps provide a way to escape the code so the compiler doesn't crash?
@hmsk
Copy link
Owner

hmsk commented Oct 15, 2018

Hi, I'm happy to hear that you're using this loader.
That's a good point, I didn't suppose such the case. Vue compiler is just compiling whole HTML from the markdown compilation. Let me have time to solve that with the decent way.

@anthonygore
Copy link
Author

Great, thank you.

For my use case, I don't think I'd ever need a component within a markdown code block, so maybe the solution is to skip any code in there.

@hmsk
Copy link
Owner

hmsk commented Oct 16, 2018

@anthonygore Just published the fix for that as v1.4.0-beta.1. Hope you try on your end 🔍
https://www.npmjs.com/package/frontmatter-markdown-loader/v/1.4.0-beta.1

@anthonygore
Copy link
Author

anthonygore commented Oct 16, 2018 •
edited
Loading

Unfortunately, it doesn't. Here's the error I get (I'm using the plugin with Nuxt):

✖ error  GEN ERR  /2018/02/05/vue-laravel-crud

Error: Module build failed (from ./node_modules/frontmatter-markdown-loader/index.js):
SyntaxError: Unexpected token (1:6209)
    at Parser.pp$4.raise (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:2610:13)
    at Parser.pp.unexpected (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:637:8)
    at Parser.pp$3.parseExprAtom (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:2094:10)
    at Parser.parseExprAtom (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:4372:24)
    at Parser.pp$3.parseExprSubscripts (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1955:19)
    at Parser.pp$3.parseMaybeUnary (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1932:17)
    at Parser.pp$3.parseExprOp (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1893:41)
    at Parser.pp$3.parseExprOps (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1876:90)
    at Parser.pp$3.parseMaybeConditional (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1857:19)
    at Parser.pp$3.parseMaybeAssign (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1832:19)
    at Parser.pp$3.parseExprList (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:2528:20)
    at Parser.pp$3.parseSubscripts (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1983:29)
    at Parser.pp$3.parseExprSubscripts (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1958:21)
    at Parser.pp$3.parseMaybeUnary (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1932:17)
    at Parser.pp$3.parseExprOp (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1893:41)
    at Parser.pp$3.parseExprOps (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1876:90)
    at Object.129 (c4ce59f971aa4fe0e5b4.js:7:7)
    at __webpack_require__ (server-bundle.js:27:30)
    at Function.module.exports.__webpack_require__.t (server-bundle.js:84:33)
    at 0b3e8c358a80dcb6805b.js:1401:30
    at <anonymous>
✖ error Error: Module build failed (from ./node_modules/frontmatter-markdown-loader/index.js):
  SyntaxError: Unexpected token (1:6209)
  at Parser.pp$4.raise (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:2610:13)
  at Parser.pp.unexpected (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:637:8)
  at Parser.pp$3.parseExprAtom (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:2094:10)
  at Parser.parseExprAtom (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:4372:24)
  at Parser.pp$3.parseExprSubscripts (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1955:19)
  at Parser.pp$3.parseMaybeUnary (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1932:17)
  at Parser.pp$3.parseExprOp (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1893:41)
  at Parser.pp$3.parseExprOps (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1876:90)
  at Parser.pp$3.parseMaybeConditional (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1857:19)
  at Parser.pp$3.parseMaybeAssign (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1832:19)
  at Parser.pp$3.parseExprList (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:2528:20)
  at Parser.pp$3.parseSubscripts (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1983:29)
  at Parser.pp$3.parseExprSubscripts (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1958:21)
  at Parser.pp$3.parseMaybeUnary (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1932:17)
  at Parser.pp$3.parseExprOp (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1893:41)
  at Parser.pp$3.parseExprOps (/Users/anthonygore/Projects/pwa-news/node_modules/vue-template-es2015-compiler/buble.js:1876:90)
  at Object.129 (c4ce59f971aa4fe0e5b4.js:7:7)
  at __webpack_require__ (server-bundle.js:27:30)
  at Function.module.exports.__webpack_require__.t (server-bundle.js:84:33)
  at 0b3e8c358a80dcb6805b.js:1401:30
  at <anonymous>

I've attached the offending file. The line which causes the error is:

<html lang="{{ app()->getLocale() }}">

2018-02-05-vue-laravel-crud.md.zip

@hmsk
Copy link
Owner

hmsk commented Oct 16, 2018

Sorry, that's my bad (and thank for providing your actual sample ❤️). I just published a quick fixes again as 1.4.0-beta.2

@anthonygore
Copy link
Author

beta.2 works perfectly. Thanks!

@hmsk
Copy link
Owner

hmsk commented Oct 16, 2018

Great. I will release as 1.4.0 later with some additional fixes.

@hmsk
Copy link
Owner

hmsk commented Oct 18, 2018

Released: https://www.npmjs.com/package/frontmatter-markdown-loader/v/1.4.0

Thanks for your feedback @anthonygore !

@hmsk hmsk closed this as completed Oct 18, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@hmsk @anthonygore