banderson / generator-flux-react Goto Github PK

Easily sorted manually, but since 6to5ify has been replaced by babelify it would be useful to update the template.

The gulp build task never returns to console without ctrl+c. In itself, it's just an annoyance, but I'm trying to deploy an app built using this generator to Heroku, and add the build task as a postinstall step, and I'm afraid of hangs.

I think only watch, by definition, should wait for new input. The default and build tasks should return control.

Optionally you can use .jsx extension. That will allow using

import AppContainer from './components/AppContainer';

over

import AppContainer from './components/AppContainer.jsx';

I have installed yo by npm install -g yo bower grunt-cli gulp, but fails to install npm install -g generator-flux.
Bellow is tested on ubuntu 15.04 and centos 7:

$ yo  --version
1.4.8
$ node  --version
v4.2.0
$ npm  --version
3.3.8

Both of them reported:

• fails to install generator-flux,

$ npm install -g generator-flux
/usr/local/lib
├── generator-flux@0.4.5 
└── UNMET PEER DEPENDENCY yo@>=1.0.0

npm WARN EPEERINVALID generator-flux@0.4.5 requires a peer of yo@>=1.0.0 but none was installed.

• yo flux do not work,

$ yo flux
Error flux 

You don't seem to have a generator with the name flux installed.
You can see available generators with npm search yeoman-generator and then install them with npm install [name].
To see the 0 registered generators run yo with the `--help` option.

It is noticed that package.json https://github.com/banderson/generator-flux-react/blob/master/package.json depends on "yo": ">=1.0.0" :

{
  .....,
  "peerDependencies": {
    "yo": ">=1.0.0"
  },
}

How could I solve this issue? Would you please give me some direction?

Hi Ben, any thoughts of providing a react-bootstrap option? And possibly a basic example page with a few components?

yo flux:component-bootstrap BootstrapComponentName

https://github.com/react-bootstrap/react-bootstrap

There are missing dependencies when i try to run the new generated server:

/Users/XX/projects/web/flux-test/node_modules/gulp-eslint/index.js:3
const BufferStreams = require('bufferstreams');
^^^^^
SyntaxError: Use of const in strict mode.
at Module._compile (module.js:439:25)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object. (/Users/XX/projects/web/flux-test/gulp/tasks/lint.js:2:14)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)

npm ERR! [email protected] dev: gulp --type dev
npm ERR! Exit status 8
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is most likely a problem with the objective-user-award package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! gulp --type dev
npm ERR! You can get their info via:
npm ERR! npm owner ls objective-user-award
npm ERR! There is likely additional logging output above.
npm ERR! System Darwin 16.0.0
npm ERR! command "/usr/local/Cellar/node/0.10.26/bin/node" "/usr/local/bin/npm" "run" "dev"
npm ERR! cwd /Users/XX/projects/web/flux-test
npm ERR! node -v v0.10.26
npm ERR! npm -v 1.4.3
npm ERR! code ELIFECYCLE
npm ERR!
npm ERR! Additional logging details can be found in:
npm ERR! /Users/XX/projects/web/flux-test/npm-debug.log
npm ERR! not ok code 0

Something like this ? https://github.com/darkyen/awwfood/blob/master/src/js/components/Header.jsx

It could be a config when generating the repo as we are using babel anyways why not generators with es6 syntax?

No matter what parameter you pass to this generator, it thinks there is a conflict with BaseStore. Is this by design? It seems it's not reading the argument passed to it. Is this by design?

I used the generator and opted for react-bootstrap, but keep getting missing dependancies for 'input', 'button', 'ListGroup' and 'ListGroupItem' - am I doing something wrong?

Browserify Error { [Error: Cannot find module 'react-bootstrap/Input' from '/Users/jamessherry/sites/react/src/js/components']

arning: Each child in an array or iterator should have a unique "key" prop. Check the render method of TaskList. See https://fb.me/react-warning-keys for more information.

and when creating a task and checking it:

index.js:21454 Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. This usually means that you're trying to add a ref to a component that doesn't have an owner (that is, was not created inside of another component's render method). Try rendering this component inside of a new top-level component which will hold the ref.

any ideas on how to fix it?

thanks

Follow the guidelines presented in Testing Flux Applications to auto-generate test files and configuration.

I keep getting

Browserify Error { [Error: Cannot find module 'react' from

along with loads of other similar errors when I run $ sudo npm start or $ sudo npm run dev

Hi,

I ran the generator and got the following error. Can anyone point me in the right direction to debug this?

Uncaught TypeError: Cannot read property 'component' of undefined
getThemeButton @ index.js:7179
getStyles @ index.js:7191
render @ index.js:7241
ReactCompositeComponentMixin._renderValidatedComponentWithoutOwnerOrContext @ index.js:20653ReactCompositeComponentMixin._renderValidatedComponent @ index.js:20680ReactPerf.measure.wrapper @ index.js:27212ReactCompositeComponentMixin.mountComponent @ index.js:20101ReactPerf.measure.wrapper @ index.js:27212ReactReconciler.mountComponent @ index.js:28027ReactMultiChild.Mixin.mountChildren @ index.js:26651ReactDOMComponent.Mixin._createContentMarkup @ index.js:21421ReactDOMComponent.Mixin.mountComponent @ index.js:21331ReactReconciler.mountComponent @ index.js:28027ReactCompositeComponentMixin.mountComponent @ index.js:20111ReactPerf.measure.wrapper @ index.js:27212ReactReconciler.mountComponent @ index.js:28027ReactCompositeComponentMixin.mountComponent @ index.js:20111ReactPerf.measure.wrapper @ index.js:27212ReactReconciler.mountComponent @ index.js:28027ReactCompositeComponentMixin.mountComponent @ index.js:20111ReactPerf.measure.wrapper @ index.js:27212ReactReconciler.mountComponent @ index.js:28027mountComponentIntoNode @ index.js:25817Mixin.perform @ index.js:31714batchedMountComponentIntoNode @ index.js:25838Mixin.perform @ index.js:31714ReactDefaultBatchingStrategy.batchedUpdates @ index.js:22892batchedUpdates @ index.js:29885ReactMount._renderNewRootComponent @ index.js:25973ReactPerf.measure.wrapper @ index.js:27212ReactMount.render @ index.js:26062ReactPerf.measure.wrapper @ index.js:272121../components/AppContainer.jsx @ index.js:14s @ index.js:1e @ index.js:1(anonymous function)

When I create a new project and run ESLint through Atom's linter-eslint plugin the first thing I notice is that the .eslintrc contains 3 rules that no longer exist in the current version of ESLint. Perhaps the problem is that I am using a different version of .eslint than the developer.

After removing these rules I find that many of the files contain a large number of linter errors. The project does not seem to comply with its own set of linting rules.

I noticed that the gulp file does not seem to have a task for linting the project. This makes me wonder if ESLint is actually meant to be used with this project and if not why it contains the .eslintrc file.

This is just a placeholder for me to revisit, so if you're interested in tracking or suggesting any of these, subscribe to this issue. I may come back and reevaluate adding more options for things I've thought about in the past:

• Less CSS
• WebPack instead of Browserify
• What else...?

Installation goes fine, but when running gulp this error is thrown:

Error: Cannot find module 'gulp-sass'

Easy-to-solve problem, just go npm install gulp-sass, but the generator should have it as a dependency so it doesn't happen at all.

Edit: Thanks for the generator btw.

When I'm trying to run this with: npm run dev I get a lot of errors about missing modules. What did I do wrong? I did npm install and bower install but it didn't change anything.

Edit: The errors seem to be in the gulp/tasks/ folder

We currently have subgenerators for ActionCreators, Dispatchers, and Stores, but no React Component scaffolder yet. This is the last type of component needed for full subgenerator support.

After generating the project and running npm start, I ran into this error

[06:33:12] Browserify Error { [SyntaxError: C:/projects/react/gen-flux-demo/src/js/index.jsx: Unexpected token (4:13) while parsing file: C:\projects\react\gen-flux-demo\src\js\index.jsx]
  pos: 99,
  loc: Position { line: 4, column: 13 },
  _babel: true,
  codeFrame: '\u001b[0m  2 | \u001b[36mimport\u001b[39m AppContainer from \u001b[31m\'./components/AppContainer.jsx\'\u001b[39m\u001b[1m;\u001b[22m\n  3 | \n> 4 | React\u001b[1m.\u001b[22mrender\u001b[94m\u001b[1m(\u001b[22m\u001b[39m\u001b[1m<\u001b[22mAppContainer \u001b[1m/\u001b[22m\u001b[1m>\u001b[22m\u001b[1m,\u001b[22m document\u001b[1m.\u001b[22mgetElementById\u001b[94m\u001b[1m(\u001b[22m\u001b[39m\u001b[31m\'main\'\u001b[39m\u001b[94m\u001b[1m)\u001b[22m\u001b[39m\u001b[94m\u001b[1m)\u001b[22m\u001b[39m\u001b[1m;\u001b[22m\n    |              ^\n  5 | \u001b[0m',
  filename: 'C:\\projects\\react\\gen-flux-demo\\src\\js\\index.jsx',

I am getting same error on Linux as well

Any ideas?

on 0.3.1, I used the bootstrap option with yeoman and when I tried to npm start I was missing these dev dependencies:

• gulp-connect
• gulp-sass

I'm not familiar with how yeoman is setup, but maybe I'll try to PR this.

var a = assign(EventEmitter.prototype, {
  foo: '3'
});
var b = assign(EventEmitter.prototype, {
 foo: '4'
});

a === b; // true

why ? because EventEmitter.prototype is the target, this causes stores to leak into each other.

Hi,

I'm getting the following error while using the default template for MaterialUI

TypeError: _materialUi.Styles.ThemeManager is not a constructor

It appears to be at index.js at line 41907 (column 20).

Browserify Error { [Error: Cannot find module 'react-dom' from '/Users/bsiemon/src/station/node_modules/react-overlays/lib/utils']

I then run npm install react-dom to fix but then the browserify translation appears to stop working with:

[20:06:53] Browserify Error { [SyntaxError: /Users/bsiemon/src/old-station/src/js/index.jsx: Unexpected token (4:13) while parsing file: /Users/bsiemon/src/old-station/src/js/index.jsx]
  pos: 99,
  loc: Position { line: 4, column: 13 },
  _babel: true,
  codeFrame: '\u001b[0m  2 | \u001b[36mimport\u001b[39m AppContainer from \u001b[31m\'./components/AppContainer.jsx\'\u001b[39m\u001b[1m;\u001b[22m\n  3 | \n> 4 | React\u001b[1m.\u001b[22mrender\u001b[34m\u001b[1m(\u001b[22m\u001b[39m\u001b[1m<\u001b[22mAppContainer \u001b[1m/\u001b[22m\u001b[1m>\u001b[22m\u001b[1m,\u001b[22m document\u001b[1m.\u001b[22mgetElementById\u001b[34m\u001b[1m(\u001b[22m\u001b[39m\u001b[31m\'main\'\u001b[39m\u001b[34m\u001b[1m)\u001b[22m\u001b[39m\u001b[34m\u001b[1m)\u001b[22m\u001b[39m\u001b[1m;\u001b[22m\n    |              ^\n  5 | \u001b[0m',
  filename: '/Users/bsiemon/src/old-station/src/js/index.jsx',
  stream: 

The index.jsx is the vanilla file included with the todo app.

Others like generator-webapp work/appear finely.

My npm -g root is /usr/local/lib/node_modules and I have OSX 10.9.4. I'm running all -g commands without sudo. Yeoman v1.2.1.
Generator doesn't appear in yo command list after installation (no warnings, etc), can't run yo flux.
Tried to install via both npm and yo.

after running yo flux, the package json file does not have devDependencies or dependencies in it at all, it's completely empty. Anything I'm doing wrong?

Background / Cause

There's currently an issue when choosing the Material UI theme, which causes two versions of react to be loaded on the page. There is a fix coming soon in NPM, but I won't know for sure until it lands.

Workaround

For now, run npm dedupe after the scaffolder finishes running, and restart the dev server (if you previously started it), which should fix the issue in the meantime.

After generating a project by using this generator the command gulp browserify does not work cause at file/src/js/index.js there is the following require sentece: App = require('./components/app');

The file is called App.js so it cant find the file. Working after changing it to require('./components/App');

Im using Ubuntu!

Thanks for you effort!

Great project, thanks for sharing it.
I had to change this:
if (this.refs.checkbox.getDOMNode().checked) {
to this:
if (this.refs.checkbox.getChecked() ) {

to get it to find the dom node. Is this something different with the new version of react? I'm just making sure I'm not missing something.