froala / react-froala-wysiwyg

React component for Froala WYSIWYG HTML Rich Text Editor.
https://froala.com/wysiwyg-editor
562 stars 130 forks source link

this.$element.froalaEditor is not a function(…) #11

Closed foodaka closed 7 years ago

foodaka commented 7 years ago

Ive spent over an hour, still cannot get it up and running

webpack

      new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery"
      })

package.json

  "devDependencies": {
    "autoprefixer": "^6.3.7",
    "babel-core": "^6.14.0",
    "babel-loader": "^6.2.5",
    "babel-plugin-transform-regenerator": "^6.14.0",
    "babel-plugin-transform-runtime": "^6.12.0",
    "babel-polyfill": "^6.13.0",
    "babel-preset-es2015": "^6.14.0",
    "babel-preset-react": "^6.1.18",
    "babel-preset-stage-0": "^6.5.0",
    "babel-root-import": "^3.2.2",
    "chai-jquery": "^2.0.0",
    "classnames": "^2.2.5",
    "css-loader": "^0.23.1",
    "eslint": "^3.1.1",
    "eslint-loader": "^1.5.0",
    "eslint-plugin-react": "^5.2.2",
    "html-loader": "^0.4.3",
    "html-webpack-plugin": "^2.21.0",
    "image-webpack-loader": "^1.7.0",
    "immutable": "^3.8.1",
    "imports-loader": "^0.6.5",
    "json-loader": "^0.5.4",
    "postcss-loader": "^0.9.1",
    "precss": "^1.4.0",
    "react-hot-loader": "^1.3.0",
    "redux-logger": "^2.6.1",
    "style-loader": "^0.13.1",
    "webpack": "^1.12.9",
    "webpack-dev-server": "^1.14.0"
  },
  "dependencies": {
    "async": "^1.5.2",
    "axios": "^0.12.0",
    "babel-preset-es2015": "^6.13.2",
    "babel-preset-stage-1": "^6.1.18",
    "babel-runtime": "^6.11.6",
    "babyparse": "^0.4.6",
    "co": "^4.6.0",
    "csvtojson": "^1.0.0",
    "d3": "^4.2.0",
    "file-loader": "^0.8.5",
    "file-saver": "^1.3.2",
    "fixed-data-table": "^0.6.3",
    "google-map-react": "^0.12.0",
    "halogen": "^0.2.0",
    "history": "^2.0.2",
    "jquery": "^3.1.0",
    "json2csv": "^3.6.2",
    "leaflet": "^0.7.7",
    "lodash": "^4.16.4",
    "moment": "^2.15.1",
    "moment-range": "^2.2.0",
    "nuka-carousel": "^1.2.1",
    "postcss-css-variables": "^0.6.0",
    "rc-calendar": "^5.5.0",
    "react": "^15.3.2",
    "react-addons-shallow-compare": "^15.3.2",
    "react-big-calendar": "^0.10.3",
    "react-bootstrap": "^0.29.5",
    "react-bootstrap-daterangepicker": "^3.1.0",
    "react-bootstrap-table": "^2.5.5",
    "react-data-grid": "^0.14.16",
    "react-datepicker": "^0.29.0",
    "react-daterange-picker": "^1.1.0",
    "react-dates": "^3.1.1",
    "react-datetime": "^2.7.5",
    "react-dom": "^15.3.2",
    "react-dropzone": "^3.7.2",
    "react-google-charts": "^1.0.2",
    "react-google-maps": "^4.10.0",
    "react-input-calendar": "^0.3.9",
    "react-loader": "^2.2.0",
    "react-month-picker": "^1.0.12",
    "react-redux": "^4.0.0",
    "react-router": "^2.2.2",
    "react-router-redux": "^4.0.0",
    "react-select": "^0.9.1",
    "react-slick": "^0.14.5",
    "react-timeago": "^3.0.0",
    "redux": "^3.0.4",
    "redux-logger": "^2.6.1",
    "redux-promise": "^0.5.1",
    "redux-thunk": "^2.1.0",
    "sweetalert": "^1.1.3"
  }
ghoshnirmalya commented 7 years ago

Related to https://github.com/froala/react-froala-wysiwyg/issues/7.

stefanneculai commented 7 years ago

I believe that somehow there were 2 different versions of jQuery. Using react-froala-wysiwyg@2.4.0 should fix this problem.