Alex Ung Alex Ung - 3 months ago 68
Javascript Question

How do you use mobx with react rails?

While trying to use react-rails, I've been running into issues incorporating

mobx
as state management into my app.

I was under the impression that the rails asset pipeline would bring in mobx to react, but, this hasn't been successful. I'm using the react-rails gem and trying to incorporate mobx into my react.es6.jsx sheets in the components folder.

my package.json file:

{
"name": "rent-pseudo",
"version": "1.0.0",
"description": "== Zipqode",
"main": "index.js",
"dependencies": {
"babel-plugin-syntax-async-functions": "^6.3.13",
"babel-plugin-transform-regenerator": "^6.3.18",
"babel-polyfill": "^6.3.14",
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-stage-0": "^6.3.13",
"babelify": "^7.2.0",
"bourbon": "^4.2.7",
"bourbon-neat": "^1.8.0",
"browserify": "^13.1.0",
"browserify-incremental": "^3.1.1",
"font-awesome": "^4.6.3",
"graphql": "^0.6.2",
"mobx": "2.4.1",
"mobx-react": "^3.5.3",
"mobx-react-devtools": "^4.2.5",
"react": "^15.3.1",
"react-dom": "^15.3.1",
"react-google-maps": "^4.11.0",
"react-router": "2.6.1",
"es6-promise": "^3.0.2",
"fetch": "^0.3.6",
"jquery": "^2.1.4",
"jquery-ujs": "^1.0.4"
},
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://alexung@github.com/alexung/rent-pseudo.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/alexung/rent-pseudo/issues"
},
"homepage": "https://github.com/alexung/rent-pseudo#readme"
}


My first react file that's included in
/components
:

import { observer } from 'mobx-react'

const SearchResultsLayout = observer(React.createClass({
render: function() {
return (
<h1>Hello, World</h1>
)
}
}))


But I keep getting the error
VM3275:1 Uncaught ReferenceError: SearchResultsLayout is not defined


Any ideas?

Answer

For those interested in knowing, the react_on_rails gem is better for incorporating mobx. Got it to work this morning by simply installing the gem and npm installing mobx into my package.json that's included in the client folder