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.

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

Are custom parsers possible? #35

Open
JosephScript opened this issue Jan 4, 2017 · 1 comment
Open

Are custom parsers possible? #35

JosephScript opened this issue Jan 4, 2017 · 1 comment

Comments

@JosephScript
Copy link

Is there any way to add a custom css parser using this loader? For example:

preLoaders: [
      { 
        test: /\.tag$/,
        exclude: /node_modules/,
        loader: 'riotjs-loader',
        query: {
          type: 'es6',
          style: 'myparser',
          parsers: {
            css: {
              myparser: (tagName, css) => {
                return css.replace(/@tag/, tag)
              }
            }
          }
        }
     }
    ]

I've tried a handful of things, and always get the error Module build failed: Error: Riot parser "css. myparser" is not registered. when including the style type <style type='myparser'>.

Thanks!

@JosephScript
Copy link
Author

I've updated to webpack 2 so the loader looks different (pre instead of preLoaders for example), but I've also tried both of these ways. According to the docs the compiler (http://riotjs.com/guide/compiler/) should accept either one of these to allow me to transform the css within the functions, but they're never executed. I see them being passed into the riot.compile function though, like expected:

module: {
    rules: [
      {
        enforce: 'pre',
        test: /\.tag$/,
        exclude: /node_modules/,
        loader: 'riotjs-loader',
        options: {
          style: 'myparser',
          parsers: {
           css: {
               myparser: function (tagName, css, opts, url) {
                 var res = sass.renderSync({ data: css })
                 // do work here
                 return res.css.toString()
               }}},
          parserOptions: {
            style: function (tagName, css, opts, url) {
              var res = sass.renderSync({ data: css })
              // do work here
              return res.css.toString()
            }
          }
        }
      }
]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant