Browserify the code?

[orels1]

First of all - thanks for a great tool, which will come in handy many times for smaller projects (like landing pages and so on.

But I really wish that you would browserify the code, so I could import React from 'react' for example.

If I'm doing something wrong - it'll be cool to know

[davej]

I want to keep it super simple for the moment. As bugs are ironed out and 1.0 is released, I'll start exploring if there's a simple way to support modules. Thanks for your feedback! :)

[mtimofiiv]

+1 on this feature request - would be fantastic.

Currently, I really love this project, but I can't use it anywhere except the simplest landing pages.

[davej]

Noted.

I've given this a post-v1.0 milestone tag. I'll reopen and re-investigate once 1.0 is released. For now, I'm keeping any issue that is post 1.0 closed.

[Daidalos117]

And what is the easiest ways to make it work? Thank you.

[mtimofiiv]

@Daidalos117 I suppose integrating browserify into the module would be easiest.

[lunelson]

Another option for those who are just using Pingy as a quick prototyping tool, would be to offer a Javascript option that leverages native ES Modules support in bleeding-edge browsers, by using type="module" on the script tag. It requires enabling a special flag on the browser; but otherwise would 'just work'. You might call it Javascript ESM for example, to differentiate from the straight Javascript option. Implicitly, a lot of ESx features come with it too, without the need for Babel. Or, there may be a configuration of Babel that would transpile ES7+ plus things without transpiling import statements to require calls...

<script type="module" src="module.js"></script>

REF: https://medium.com/dev-channel/es6-modules-in-chrome-canary-m60-ba588dfb8ab7

[lunelson]

It seems you can add a modules: false option to the .babelrc file options for babel-preset-env, to disable changing of the module format

EDIT: just tested this, can confirm it works fine in Chrome 61+. The catch is that you cannot leave off the .js extension in import statements, like you can with module bundlers and in Node

[davej]

Thanks @lunelson, that's very helpful.

[lunelson]

Glad to help. The only snag seems to be that changes to .js files other than the main one don't trigger a livereload event. If you choose to implement these suggestions that would need some kind of patch too.

[davej]

The only snag seems to be that changes to .js files other than the main one don't trigger a livereload event.

Ah, I'll consider that a bug and create an issue for it. Thanks!

[davej]

@lunelson: As of v0.9.5, Live reload should now work with type="module" scripts and it's descendant modules.