Last active
January 2, 2018 16:37
-
-
Save ipeychev/4745234a1f4d41608b8c to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta content='text/html; charset=utf-8' http-equiv='Content-type'> | |
| <title>AlloyEditor as React Module Example</title> | |
| <link href="bower_components/alloyeditor/dist/alloy-editor/assets/alloy-editor-ocean-min.css" rel="stylesheet"> | |
| <style> | |
| #main { | |
| left: 100px; | |
| position: relative; | |
| top: 100px; | |
| } | |
| </style> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script> | |
| <script src="bower_components/alloyeditor/dist/alloy-editor/alloy-editor-no-react-min.js"></script> | |
| </head> | |
| <body> | |
| <div id="main"></div> | |
| <script type="text/jsx"> | |
| var AlloyEditorModule = React.createClass({ | |
| componentDidMount: function() { | |
| this._editor = AlloyEditor.editable(this.props.container, this.props.alloyEditorConfig); | |
| }, | |
| componentWillUnmount: function() { | |
| this._editor.destroy(); | |
| }, | |
| render: function() { | |
| return ( | |
| <div id={this.props.container}> | |
| <h1>AlloyEditor will make this content editable</h1> | |
| <p> | |
| To install React, follow the instructions on <a href="https://github.com/facebook/react/">GitHub</a>. | |
| </p> | |
| <p> | |
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel metus nunc. Maecenas rhoncus congue faucibus. Sed finibus ultrices turpis. Mauris nulla ante, aliquam a euismod ut, scelerisque nec sem. Nam dapibus ac nulla non ullamcorper. Sed vestibulum a velit non lobortis. Proin sit amet imperdiet urna. Aenean interdum urna augue, vel mollis tortor dictum vitae. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Mauris vitae suscipit magna. | |
| </p> | |
| </div> | |
| ); | |
| } | |
| }); | |
| React.render(React.createElement(AlloyEditorModule, { | |
| container: 'editable' | |
| }), document.getElementById('main')); | |
| </script> | |
| </body> | |
| </html> |
Hi, I have the same issue
I currently am running into this issue as well with the same errors as cedricdelpoux. Not quite sure how to fix it. If you could help me out that would be great.
Same here, no solution. Desperate :D
Same here+1
+1
Same here.
Same issue
+1
Hey , Did any one solve this issue ? Thanks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hi @ipeychev, I tried this but I have errors in my browser console.
Cannot read property 'add' of undefinedin alloy-editor-no-react.js:12062Cannot set property 'dir' of undefinedin alloy-editor-no-react.js:237I read I maybe have to to redefine
window.ALLOYEDITOR_BASEPATHandAlloyEditor.regexBasePathbut I don't know exactly what to write.I tried this regex
AlloyEditor.regexBasePath = /nodes_modules\/alloyeditor\/dist\/alloy-editor\/allow-editor-no-react-min.js/but it does not work.I use
import AlloyEditor from "alloyeditor"to import Alloy et compile my js with webpack