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

Usage with Browserify #139

Closed
jeromegn opened this Issue Jan 22, 2015 · 17 comments

Comments

Projects
None yet
9 participants
@jeromegn

jeromegn commented Jan 22, 2015

Probably related to #136 and #137, but it would be nice to be able to use this as a npm package with browserify.

npm install riot
var riot = require('riot')
riot.mount('todo')

Do .tag files have to be precompiled? This could be an issue. It could also be fine if the individual components (or tags) as npm packages did their own compiling.

@popomore

This comment has been minimized.

Show comment
Hide comment
@popomore

popomore Jan 22, 2015

+1

Can source code be commonjs? Using browserify to build files.

popomore commented Jan 22, 2015

+1

Can source code be commonjs? Using browserify to build files.

@jeromegn

This comment has been minimized.

Show comment
Hide comment
@jeromegn

jeromegn Jan 22, 2015

Also, if the node.js API allowed or the CLI allowed for string input (stdin for the CLI and a string for the node.js API), it would be easy to create a riotify browserify transform to process the .tag files automatically.

jeromegn commented Jan 22, 2015

Also, if the node.js API allowed or the CLI allowed for string input (stdin for the CLI and a string for the node.js API), it would be easy to create a riotify browserify transform to process the .tag files automatically.

@tipiirai

This comment has been minimized.

Show comment
Hide comment
@tipiirai

tipiirai Jan 23, 2015

Member

Sounds like a great idea!

Member

tipiirai commented Jan 23, 2015

Sounds like a great idea!

@jhthorsen

This comment has been minimized.

Show comment
Hide comment
@jhthorsen

jhthorsen Jan 23, 2015

Member

+1

I just made a "riotify" transform package, but it has limited usage, because of this limitation.

https://www.npmjs.com/package/riotify

Member

jhthorsen commented Jan 23, 2015

+1

I just made a "riotify" transform package, but it has limited usage, because of this limitation.

https://www.npmjs.com/package/riotify

@aurri aurri self-assigned this Jan 23, 2015

@egeozcan

This comment has been minimized.

Show comment
Hide comment
@egeozcan

egeozcan Jan 23, 2015

I'm trying to make it work with gulp & browserify.

gulp.task('riot', function (cb) {
  exec('riot ./src', function (err, stdout, stderr) {
    console.log(stdout);
    console.log(stderr);
    cb(err);
  });
});

Riot just puts the .js files next to the .tag files which I named like FooTag.tag, so I can have a */**/*Tag.js in my .hgignore. I tried adding that gulp task as a dependency to my browserify build task and required the outputted js files from normal files. I still can't do require('riot') because browserify can't convert it but it works if riot is already in the global scope.

egeozcan commented Jan 23, 2015

I'm trying to make it work with gulp & browserify.

gulp.task('riot', function (cb) {
  exec('riot ./src', function (err, stdout, stderr) {
    console.log(stdout);
    console.log(stderr);
    cb(err);
  });
});

Riot just puts the .js files next to the .tag files which I named like FooTag.tag, so I can have a */**/*Tag.js in my .hgignore. I tried adding that gulp task as a dependency to my browserify build task and required the outputted js files from normal files. I still can't do require('riot') because browserify can't convert it but it works if riot is already in the global scope.

@ariesjia

This comment has been minimized.

Show comment
Hide comment
@ariesjia

ariesjia commented Jan 24, 2015

+1

@aurri

This comment has been minimized.

Show comment
Hide comment
@aurri

aurri Jan 24, 2015

Contributor

Yup, this is high on our list.

Contributor

aurri commented Jan 24, 2015

Yup, this is high on our list.

@tipiirai tipiirai modified the milestone: 2.0.2 Jan 24, 2015

@aurri

This comment has been minimized.

Show comment
Hide comment
@aurri

aurri Jan 24, 2015

Contributor

This will be possible in the next release (already implemented):

npm install riot
var riot = require('riot')
riot.mount('todo')

Transform is coming after that (likely in another release).

Contributor

aurri commented Jan 24, 2015

This will be possible in the next release (already implemented):

npm install riot
var riot = require('riot')
riot.mount('todo')

Transform is coming after that (likely in another release).

@aurri aurri modified the milestones: 2.0.2, 2.0.3 Jan 25, 2015

@jhthorsen

This comment has been minimized.

Show comment
Hide comment
@jhthorsen

jhthorsen Jan 25, 2015

Member

@aurri: Could you tell me...

  1. How I can improve the tranform I wrote #139 (comment)
  2. Let me know how I can hand over the npm namespace to you (I'm new to node)
Member

jhthorsen commented Jan 25, 2015

@aurri: Could you tell me...

  1. How I can improve the tranform I wrote #139 (comment)
  2. Let me know how I can hand over the npm namespace to you (I'm new to node)
@aurri

This comment has been minimized.

Show comment
Hide comment
@aurri

aurri Jan 25, 2015

Contributor

@jhthorsen: We're currently focused on wrapping things up for the next release. Browserify transform will follow soon after that. Will definitely look at riotify once we get to that. Thanks!

Contributor

aurri commented Jan 25, 2015

@jhthorsen: We're currently focused on wrapping things up for the next release. Browserify transform will follow soon after that. Will definitely look at riotify once we get to that. Thanks!

@jhthorsen

This comment has been minimized.

Show comment
Hide comment
@jhthorsen

jhthorsen Jan 26, 2015

Member

Cool! Let me know if you add support for streaming, and I'll update my transform package accordingly.

Member

jhthorsen commented Jan 26, 2015

Cool! Let me know if you add support for streaming, and I'll update my transform package accordingly.

@aurri

This comment has been minimized.

Show comment
Hide comment
@aurri

aurri Jan 26, 2015

Contributor

Added riotify to the docs (pending update): 17379b1

Thanks @jhthorsen, good job!

Not sure about the disclaimer.

It's actually now possible to use riot with browserify:

npm install riot
var riot = require('riot')
riot.mount('todo')

And riotify examples seem to show it working exactly as it should:

require('./todo.tag')
riot.mount('todo')

There's no use for var todo = require('./todo.tag') in Riot if that's what you mean in the disclaimer.

Contributor

aurri commented Jan 26, 2015

Added riotify to the docs (pending update): 17379b1

Thanks @jhthorsen, good job!

Not sure about the disclaimer.

It's actually now possible to use riot with browserify:

npm install riot
var riot = require('riot')
riot.mount('todo')

And riotify examples seem to show it working exactly as it should:

require('./todo.tag')
riot.mount('todo')

There's no use for var todo = require('./todo.tag') in Riot if that's what you mean in the disclaimer.

@aurri aurri closed this Jan 26, 2015

@aurri

This comment has been minimized.

Show comment
Hide comment
@aurri

aurri Jan 26, 2015

Contributor

Related: #207

Contributor

aurri commented Jan 26, 2015

Related: #207

@freeall

This comment has been minimized.

Show comment
Hide comment
@freeall

freeall Feb 9, 2015

Contributor

@aurri Maybe I misunderstand, but how should riot.mount('todo') work when running through browserify? Does it look for ./todo.tag? I couldn't make it work.

@jhthorsen Nice work with riotify, using it now.

Contributor

freeall commented Feb 9, 2015

@aurri Maybe I misunderstand, but how should riot.mount('todo') work when running through browserify? Does it look for ./todo.tag? I couldn't make it work.

@jhthorsen Nice work with riotify, using it now.

@cognitom

This comment has been minimized.

Show comment
Hide comment
@cognitom

cognitom Feb 9, 2015

Member

@freeall Without riotify, pre-complie is needed before the process of Browserify.

var riot = require('riot');
require('./todo.tag.js'); // pre-compiled tag file

riot.mount('todo');

I prefer the way with riotify like below.

var riot = require('riot');
require('./todo.tag'); // no precompile needed

riot.mount('todo');
Member

cognitom commented Feb 9, 2015

@freeall Without riotify, pre-complie is needed before the process of Browserify.

var riot = require('riot');
require('./todo.tag.js'); // pre-compiled tag file

riot.mount('todo');

I prefer the way with riotify like below.

var riot = require('riot');
require('./todo.tag'); // no precompile needed

riot.mount('todo');
@jhthorsen

This comment has been minimized.

Show comment
Hide comment
@jhthorsen

jhthorsen Feb 9, 2015

Member

I'm considering making require("./todo.tag") have a return value. Please comment if you have any input: riot/riotify#9

Member

jhthorsen commented Feb 9, 2015

I'm considering making require("./todo.tag") have a return value. Please comment if you have any input: riot/riotify#9

@aurri

This comment has been minimized.

Show comment
Hide comment
@aurri

aurri Feb 9, 2015

Contributor

Thanks @cognitom, @jhthorsen!

I hope that answers your question @freeall.

Contributor

aurri commented Feb 9, 2015

Thanks @cognitom, @jhthorsen!

I hope that answers your question @freeall.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment