react-boilerplate: Cannot build when redux-form is imported

Issue Type

  • Bug

Description

The npm run build fail without any meaningful error

Steps to reproduce

  • clone & setup project
  • install redux-form@6.0.0-rc4: npm i --save --save-exact redux-form@6.0.0-rc.4
  • import redux-form in reducers.js: import { reducer as formReducer } from 'redux-form/immutable'
  • npm run build --verbose

Versions

  • Node/NPM: v6.3.1 / 3.10.3

Logs

npm info it worked if it ends with ok
npm verb cli [ '/Users/goldo/.nvm/versions/node/v6.3.1/bin/node',
npm verb cli   '/Users/goldo/.nvm/versions/node/v6.3.1/bin/npm',
npm verb cli   'run',
npm verb cli   'build',
npm verb cli   '--verbose' ]
npm info using npm@3.10.3
npm info using node@v6.3.1
npm verb run-script [ 'prebuild', 'build', 'postbuild' ]
npm info lifecycle react-boilerplate@3.0.0~prebuild: react-boilerplate@3.0.0

> react-boilerplate@3.0.0 prebuild /Users/goldo/Documents/backoffice
> npm run build:clean

npm info it worked if it ends with ok
npm verb cli [ '/Users/goldo/.nvm/versions/node/v6.3.1/bin/node',
npm verb cli   '/Users/goldo/.nvm/versions/node/v6.3.1/bin/npm',
npm verb cli   'run',
npm verb cli   'build:clean' ]
npm info using npm@3.10.3
npm info using node@v6.3.1
npm verb run-script [ 'prebuild:clean', 'build:clean', 'postbuild:clean' ]
npm info lifecycle react-boilerplate@3.0.0~prebuild:clean: react-boilerplate@3.0.0
npm info lifecycle react-boilerplate@3.0.0~build:clean: react-boilerplate@3.0.0

> react-boilerplate@3.0.0 build:clean /Users/goldo/Documents/backoffice
> npm run test:clean && rimraf ./build

npm info it worked if it ends with ok
npm verb cli [ '/Users/goldo/.nvm/versions/node/v6.3.1/bin/node',
npm verb cli   '/Users/goldo/.nvm/versions/node/v6.3.1/bin/npm',
npm verb cli   'run',
npm verb cli   'test:clean' ]
npm info using npm@3.10.3
npm info using node@v6.3.1
npm verb run-script [ 'pretest:clean', 'test:clean', 'posttest:clean' ]
npm info lifecycle react-boilerplate@3.0.0~pretest:clean: react-boilerplate@3.0.0
npm info lifecycle react-boilerplate@3.0.0~test:clean: react-boilerplate@3.0.0

> react-boilerplate@3.0.0 test:clean /Users/goldo/Documents/backoffice
> rimraf ./coverage

npm verb lifecycle react-boilerplate@3.0.0~test:clean: unsafe-perm in lifecycle true
npm verb lifecycle react-boilerplate@3.0.0~test:clean: PATH: /Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/bin/node-gyp-bin:/Users/goldo/Documents/backoffice/node_modules/.bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/bin/node-gyp-bin:/Users/goldo/Documents/backoffice/node_modules/.bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/bin/node-gyp-bin:/Users/goldo/Documents/backoffice/node_modules/.bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/usr/local/git/bin:/usr/local/go/bin:/usr/local/bin:/usr/bin:/bin:/usr/local/sbin:/usr/sbin:/sbin
npm verb lifecycle react-boilerplate@3.0.0~test:clean: CWD: /Users/goldo/Documents/backoffice
npm info lifecycle react-boilerplate@3.0.0~posttest:clean: react-boilerplate@3.0.0
npm verb exit [ 0, true ]
npm info ok
npm verb lifecycle react-boilerplate@3.0.0~build:clean: unsafe-perm in lifecycle true
npm verb lifecycle react-boilerplate@3.0.0~build:clean: PATH: /Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/bin/node-gyp-bin:/Users/goldo/Documents/backoffice/node_modules/.bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/bin/node-gyp-bin:/Users/goldo/Documents/backoffice/node_modules/.bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/usr/local/git/bin:/usr/local/go/bin:/usr/local/bin:/usr/bin:/bin:/usr/local/sbin:/usr/sbin:/sbin
npm verb lifecycle react-boilerplate@3.0.0~build:clean: CWD: /Users/goldo/Documents/backoffice
npm info lifecycle react-boilerplate@3.0.0~postbuild:clean: react-boilerplate@3.0.0
npm verb exit [ 0, true ]
npm info ok
npm verb lifecycle react-boilerplate@3.0.0~prebuild: unsafe-perm in lifecycle true
npm verb lifecycle react-boilerplate@3.0.0~prebuild: PATH: /Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/bin/node-gyp-bin:/Users/goldo/Documents/backoffice/node_modules/.bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/usr/local/git/bin:/usr/local/go/bin:/usr/local/bin:/usr/bin:/bin:/usr/local/sbin:/usr/sbin:/sbin
npm verb lifecycle react-boilerplate@3.0.0~prebuild: CWD: /Users/goldo/Documents/backoffice
npm info lifecycle react-boilerplate@3.0.0~build: react-boilerplate@3.0.0

> react-boilerplate@3.0.0 build /Users/goldo/Documents/backoffice
> cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p

 [825] multi main 28 bytes {0} [built]
    + 883 hidden modules

npm verb lifecycle react-boilerplate@3.0.0~build: unsafe-perm in lifecycle true
npm verb lifecycle react-boilerplate@3.0.0~build: PATH: /Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/bin/node-gyp-bin:/Users/goldo/Documents/backoffice/node_modules/.bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/Users/goldo/.nvm/versions/node/v6.3.1/bin:/usr/local/git/bin:/usr/local/go/bin:/usr/local/bin:/usr/bin:/bin:/usr/local/sbin:/usr/sbin:/sbin
npm verb lifecycle react-boilerplate@3.0.0~build: CWD: /Users/goldo/Documents/backoffice
npm info lifecycle react-boilerplate@3.0.0~build: Failed to exec build script
npm verb stack Error: react-boilerplate@3.0.0 build: `cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p`
npm verb stack Exit status 2
npm verb stack     at EventEmitter.<anonymous> (/Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/lib/utils/lifecycle.js:242:16)
npm verb stack     at emitTwo (events.js:106:13)
npm verb stack     at EventEmitter.emit (events.js:191:7)
npm verb stack     at ChildProcess.<anonymous> (/Users/goldo/.nvm/versions/node/v6.3.1/lib/node_modules/npm/lib/utils/spawn.js:40:14)
npm verb stack     at emitTwo (events.js:106:13)
npm verb stack     at ChildProcess.emit (events.js:191:7)
npm verb stack     at maybeClose (internal/child_process.js:852:16)
npm verb stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:215:5)
npm verb pkgid react-boilerplate@3.0.0
npm verb cwd /Users/goldo/Documents/backoffice
npm ERR! Darwin 15.6.0
npm ERR! argv "/Users/goldo/.nvm/versions/node/v6.3.1/bin/node" "/Users/goldo/.nvm/versions/node/v6.3.1/bin/npm" "run" "build" "--verbose"
npm ERR! node v6.3.1
npm ERR! npm  v3.10.3
npm ERR! code ELIFECYCLE
npm ERR! react-boilerplate@3.0.0 build: `cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the react-boilerplate@3.0.0 build script 'cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     cross-env NODE_ENV=production webpack --config internals/webpack/webpack.prod.babel.js --color -p
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs react-boilerplate
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls react-boilerplate
npm ERR! There is likely additional logging output above.
npm verb exit [ 1, true ]

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/goldo/Documents/backoffice/npm-debug.log

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Comments: 30 (7 by maintainers)

Most upvoted comments

Ok so you need to use this on the form component:

import { Field , reduxForm } from 'redux-form/immutable'

This is an issue with redux-form and what it specifies in the jsnext:main field, not an issue with react-boilerplate.

This should be fixed in v6.0.2.

I have found that problem is caused by

    mainFields: [
      'jsnext:main',
      'main',
    ],

in webpack.config. Something wrong with redux-form ‘jsnext:main’. My solution is

    mainFields: [
      'main',
      'jsnext:main',
    ],

I think this is not the best solution but it works. Also, I found the problem in redux sources wich cause warning and may be the root of the problem. PR to redux-form

Can we reopen this issue? There is still a small issue using the <Field> object which works if I implement it in a clean project.

Its work for me

webpack.base.babel.js mainFields: [ ‘browser’, ‘main’, ‘jsnext:main’, ],

in reducer import { reducer as formReducer } from ‘redux-form/immutable’;

export default function createReducer(asyncReducers) { return combineReducers({ form: formReducer, route: routeReducer, language: languageProviderReducer, …asyncReducers, }); }

@Maxoos in your component use immutable entry too:

import { Field, reduxForm } from 'redux-form/immutable';

in internals/webpack/webpack.base.babel.js: https://github.com/mxstbr/react-boilerplate/issues/868#issuecomment-240143753

Hmm…

Try searching the gitter channel for “redux-form”. There has been some mention of it there.

Sorry, I couldn’t come up with a solution.