Issue #1180✓ SolvedOpened June 7, 2018by roboman-sil3 reactions

React with GrapeJS

Quick answerby artf❤ 2

@sakshigarg9 add grapesjs via npm, then in your code just use import grapesjs from 'grapesjs' It will work, without any need to update the webpack configuration

Read full answer below ↓

Question

Greetings, I did searches and could not particularly find a solution to my problem. Currently, I am trying to integrate my React App with GrapeJS. import React, { Component } from 'react'; import './GrapesSrc/grapes.min.js'; import GrapesIndex from 'grapejs'; class GrapesEditor extends Component { constructor(props){ super(props); } shouldComponentUpdate(){ return false } componentDidMount(){ const editor = grapesjs.init({ container : '#gjs', components: '<div class="txt-red">Hello world!</div>', style: '.txt-red{color: red}', }); } render() { return ( <div id ='gjs'> </div> ); } } export def...

Answers (3)

👍 Most helpfulartf• February 22, 2019

@sakshigarg9 add grapesjs via npm, then in your code just use import grapesjs from 'grapesjs' It will work, without any need to update the webpack configuration

thanhpd56• October 18, 2018

@Silavin Have you succeed with integrating grape and react?

cjpollard• June 7, 2018

If you're using webpack to build your React app, you can include it as a plugin. It'll pull it from node_modules. plugins: [ new webpack.ProvidePlugin({ grapesjs: "grapesjs" }) ], This worked for me.

View full discussion on GitHub →