FountainJS / generator-fountain-webapp

Yeoman 'fountain' generator to start a webapp
http://fountainjs.io
MIT License
967 stars 67 forks source link

Yeoman tutorial / TodoMVC- Nothing displaying after running #190

Open Howarth17 opened 7 years ago

Howarth17 commented 7 years ago

Description

After running the command 'npm run serve' I get an error but the project still builds. When I navigate to localhost I simply get a blank page.

Error Message & Stack Trace

ERROR in ./src/app/components/TodoTextInput.js
(Emitted value instead of an instance of Error)
C:\Users\jth\Desktop\mytodo\src\app\components\TodoTextInput.js
  40:13  error  Unnecessarily quoted property 'edit' found  quote-props

✖ 1 problem (1 error, 0 warnings)

This is the code it is complaining about

render() {
    return (
      <input
        className={
          classnames({
            'edit': this.props.editing,
            'new-todo': this.props.newTodo
          })}
        type="text"
        placeholder={this.props.placeholder}
        autoFocus="true"
        value={this.state.text}
        onBlur={this.handleBlur}
        onChange={this.handleChange}
        onKeyDown={this.handleSubmit}
        />
    );
  }

Config

Copy the content from .yo-rc.json:

{
  "generator-fountain-react": {
    "version": "1.0.0",
    "props": {
      "framework": "react",
      "modules": "webpack",
      "js": "babel",
      "ci": "",
      "css": "scss",
      "resolved": "C:\\Users\\jth\\AppData\\Roaming\\nvm\\v6.3.0\\node_modules\\generator-fountain-webapp\\node_modules\\generator-fountain-react\\generators\\app\\index.js",
      "namespace": "fountain-react:app",
      "_": [],
      "sample": "todoMVC",
      "router": "router"
    }
  }
}

Relevant Links

The tutorial I am following: http://yeoman.io/codelab/setup.html

Environment

Tell us which operating system you are using, as well as which versions of Node.js, npm, and yo. Run the following to get it quickly:

Node.js v6.3.0
win32 10.0.10586
yo 1.8.5
npm 3.10.3
Howarth17 commented 7 years ago

Not sure what the difference is or if this helps at all... but when I download from FountainJS website and select: Angular 2, webpack and npm, TypeScript, CSS, and TodoMVC template it works just fine. The error above was when I was scaffolding it through the Yeoman generator.

tuannguyenminh2086 commented 7 years ago

I have same issue. but I work with vuejs 2

Swiip commented 7 years ago

An upgrade of XO has changed a linting rule. The error is only about code style, simply follow the warning to correct the problem.

Still, we have to make a fix to have this right out of the box.

GaNir commented 7 years ago

Had the same issue. Removing the quotes from 'edit' fixes it 'edit': this.props.editing, => edit: this.props.editing,

gameboyzone commented 7 years ago

Anybody resolved this issue? I still see a blank screen in browser with no issues in running 'npm build serve'. @Swiip , @Howarth17 , @tuannguyenminh2086

See below snapshot -

capture

tuannguyenminh2086 commented 7 years ago

Did you see your error?? Redux is not defined

gameboyzone commented 7 years ago

bower install worked fine for me, and so did npm run serve. So why does this happen?