A React component

I just threw a React component up on GitHub at https://github.com/tgecho/react-prosemirror. Obviously there isn’t a lot of glue actually required, but I at least appreciate having an obvious and idiomatic way to add something like ProseMirror to my existing projects.

Any thoughts or suggestions are much appreciated!


Thanks @tgecho,

good timing – I was just about to do the same when starting to integrate prosemirror into a react project of mine. So I tried using your component. Unfortunately it broke with:

Module parse failed: /Users/benjaminkampmann/dev/beavy/node_modules/prosemirror/src/edit/main.js Line 1: Unexpected token
You may need an appropriate loader to handle this file type.
| import "./css"
| import {spanStylesAt, rangeHasStyle, style, sliceBetween, Pos, findDiffStart} from "../model"
 @ ./~/babel-loader!./~/react-prosemirror/index.js 13:30-66

Might be because of my extended webpack config (based on the webpack react kit ), but I had to add a special loader for prosemirror to enforce it will be loaded through babel (even though it might be in the node_modules):

        module: {
            loaders: [
                    // special behavior for the prosemirror plugin
                 test: /prosemirror.*js$/,
                 loader: "babel-loader?stage=0"

Leaving this here for future reference.


Interesting. I’m still a bit new to the idea of publishing modules that may require transpilation to run, so I’m very open to thoughts on making this more workflow friendly.

react-prosemirror (and ProseMirror itself) are both written in ES6, and don’t include transpiled output in their repos. I imagine once I start pushing to NPM (waiting for PM to start first) I could pretranspile it.

I personally tend to not run Babel over most things in node_modules as well for performance reasons, but I’m also happy to whitelist modules that publish raw ES6 source. I’ll make the note about Babel in the readme a bit more explicit.

Like I said, I’m open to thoughts. Thanks for trying it out!