infernojs / inferno

:fire: An extremely fast, React-like JavaScript library for building modern user interfaces
https://infernojs.org
MIT License
16.09k stars 635 forks source link

inferno-mobx #424

Closed russelgal closed 8 years ago

russelgal commented 8 years ago

is inferno-mobx ready for inferno 1 beta?

`ERROR in ./app/templates.js Module parse failed: /Volumes/sites/tork812.dev/node_modules/babel-loader/index.js?{"cacheDirectory":true,"plugins":["transform-decorators-legacy","inferno"],"presets":["es2015","stage-0"]}!/Volumes/sites/tork812.dev/app/templates.js Unexpected token (530:149) You may need an appropriate loader to handle this file type. var TopNav = exports.TopNav = (0, _infernoMobx.observer)(function (props) {
return $createOptVElement(bp56, null, [$createOptVElement(bp53, null, $createOptVElement(bp52, null, /Bulma logo/, null, null, null), null, null, null), $createOptVElement(bp54, null, null, null, null, null), $createOptVElement(bp55, null, null, null, null, null)], null, null, null);
});`
trueadm commented 8 years ago

Is this using beta3? @nightwolfz might know more on this issue.

russelgal commented 8 years ago

thanx for fast answer! beta3 - of course.

nightwolfz commented 8 years ago

@russelgal Can you try the latest version of inferno-mobx 1.0.0-beta1 ?

Let me know if the issue is still there (or even better, an example !)

russelgal commented 8 years ago

@nightwolfz, thank you everything works with es2015 components

but stateless components - no:

import Inferno from 'inferno';
import Component from "inferno-component";
import {observer} from 'inferno-mobx';
import createElement from 'inferno-create-element';

@observer
export class App extends Component {

    render() {

        return <div>
            <TopNav/>
        </div>

    }
}

const TopNav = observer(props=> {
    return (
        <nav className="nav is-narrow">
        </nav>
    )

});

shows error

Uncaught TypeError: Cannot read property 'props' of undefined
    at Cl.render (inferno-mobx.js:350)
    at enhancedRender (inferno-mobx.js:155)
    at Object.allowStateChanges (mobx.js:634)
    at Reaction.<anonymous> (inferno-mobx.js:163)
    at trackDerivedFunction (mobx.js:901)
    at Reaction.track (mobx.js:1230)
    at reactiveRender (inferno-mobx.js:159)
    at Cl.initialRender (inferno-mobx.js:187)
    at createStatefulComponentInstance (inferno-dom.js:1545)
    at mountVComponent (inferno-dom.js:2045)
{
  "name": "application-name",
  "version": "0.0.1",
  "scripts": {
    "critical": "gulp",
    "browser-sync": "browser-sync start --proxy 'tork812.dev' --files './*.html' --no-notify",
    "build-prod": "NODE_ENV='production' webpack -p --display-reasons --display-modules -v --optimize-dedupe  ",
    "build-vendor": "webpack  --config vendor.webpack.config.js -p --display-reasons --display-modules -v --optimize-dedupe  ",
    "build-vendor-dev": "webpack  --config vendor.webpack.config.js -d --display-reasons --display-modules -v --optimize-dedupe  ",
    "build-prod-stat": "webpack -p --display-reasons --display-modules -v --optimize-dedupe --profile --json > stats.json ",
    "build-dev": "webpack -d --display-reasons --display-modules -v",
    "inferno-dev": "curl -L https://github.com/trueadm/inferno/archive/dev.zip > ./js/i.zip && unzip -o ./js/i.zip -d ./js/",
    "browser": "webpack-dev-server  -d --devtool source-map --inline --hot --host 0.0.0.0 --info --history-api-fallback=true",
    "browser1": "webpack-dev-server  -d --devtool source-map --inline --hot --compress --info",
    "update": "npm update --save --save-dev"
  },
  "dependencies": {
    "hoist-non-inferno-statics": "^1.1.1",
    "inferno": "^1.0.0-beta3",
    "inferno-component": "^1.0.0-beta3",
    "inferno-create-class": "^1.0.0-beta3",
    "inferno-create-element": "^1.0.0-beta3",
    "inferno-dom": "^1.0.0-beta3",
    "inferno-mobx": "1.0.0-beta1",
    "inferno-server": "^1.0.0-beta3",
    "mobx": "^2.6.0",
    "mobx-logger": "^0.3.1",
    "mobx-utils": "^1.1.0"
  },
  "devDependencies": {
    "babel-core": "^6.17.0",
    "babel-loader": "^6.2.5",
    "babel-plugin-inferno": "^1.0.0-beta2",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-preset-es2015": "^6.16.0",
    "babel-preset-stage-0": "^6.16.0",
    "webpack": "^2.1.0-beta.25",
    "webpack-dev-server": "2.1.0-beta.8"
  }
}

and as usual I'm sorry for the English

nightwolfz commented 8 years ago

@russelgal Thanks for the example! I pushed a fix to the dev branch of inferno.

I guess we'll have to wait until 1.0.0-beta4 is out before it's on NPM

Havunen commented 8 years ago

@nightwolfz did you also include tests?

Note: when committing code you can include github ticket by using hashtags in comment. fe this ticket is #424, then it shows here in this thread.

nightwolfz commented 8 years ago

@Havunen #431

Yes, although they don't cover everything yet