Black Lives Matter. Please consider donating to Black Girls Code today.

Npm install Error in win10 ..... how to solve this problem [ solved ]

Dash
#1

I follow the user guide on dash , in the Step 4

Step 4 - Test the Generated Boilerplate

npm install

[builder:proc:end:1] Command: NODE_ENV=test karma start node_modules/dash-components-archetype/config/karma/karma.conf.coverage.js
Command failed: cmd /d /s /c NODE_ENV=test karma start node_modules/dash-components-archetype/config/karma/karma.conf.coverage.js

[builder:proc:end:1] Command: builder run lint && builder run test-frontend-cov
[builder:builder-core:end:10676] Task: run check, Error: Command failed: cmd /d /s /c builder run lint && builder run test-frontend-cov

npm ERR! Test failed. See above for more details.

npm ERR! addLocalDirectory Could not pack C:\Users\jimmybow\myapp3 to C:\Users\jimmybow\AppData\Roaming\npm-cache\myapp3\0.0.1\package.tgz
npm ERR! addLocal Could not install C:\Users\jimmybow\myapp3
npm ERR! Windows_NT 10.0.10586
npm ERR! argv “C:\Program Files\nodejs\node.exe” “C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js” “install” "-g"
npm ERR! node v4.4.3
npm ERR! npm v2.15.1
npm ERR! code ELIFECYCLE
npm ERR! myapp3@0.0.1 prepublish: npm test && builder run build-dist && npm run copy-lib
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the myapp3@0.0.1 prepublish script ‘npm test && builder run build-dist && npm run copy-lib’.
npm ERR! This is most likely a problem with the myapp3 package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! npm test && builder run build-dist && npm run copy-lib
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs myapp3
npm ERR! Or if that isn’t available, you can get their info via:
npm ERR!
npm ERR! npm owner ls myapp3
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\jimmybow\myapp3\npm-debug.log

#2

then I use cross-env … but

[builder:config:environment] {“cwd”:“C:\Users\jimmybow\myapp2”,“dir”:“C:\Users\jimmybow\myapp2\node_modules\builder\lib”}
[builder:builder-core:start:11504] Started: run check
[builder:run] check - builder run lint && builder run test-frontend-cov
[builder:proc:start] Command: builder run lint && builder run test-frontend-cov
[builder:config:environment] {“cwd”:“C:\Users\jimmybow\myapp2”,“dir”:“C:\Users\jimmybow\myapp2\node_modules\builder\lib”}
[builder:builder-core:start:10080] Started: run lint
[builder:run] lint - eslint --fix --ignore-path .gitignore .
[builder:proc:start] Command: eslint --fix --ignore-path .gitignore .
[builder:proc:end:0] Command: eslint --fix --ignore-path .gitignore .
[builder:builder-core:end:10080] Task: run lint ended normally
[builder:config:environment] {“cwd”:“C:\Users\jimmybow\myapp2”,“dir”:“C:\Users\jimmybow\myapp2\node_modules\builder\lib”}
[builder:builder-core:start:10388] Started: run test-frontend-cov
[builder:run] test-frontend-cov - cross-env NODE_ENV=test karma start node_modules/dash-components-archetype/config/karma/karma.conf.coverage.js
[builder:proc:start] Command: cross-env NODE_ENV=test karma start node_modules/dash-components-archetype/config/karma/karma.conf.coverage.js
14 07 2017 17:55:28.990:ERROR [preprocess]: Can not load “webpack”!
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

  • configuration.module has an unknown property ‘preLoaders’. These properties are valid:
    object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, loaders?, noParse?, rules?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp?, strictExportPresence?, strictThisContextOnImports? }
    Options affecting the normal modules (NormalModuleFactory).
  • configuration.resolve has an unknown property ‘root’. These properties are valid:
    object { alias?, aliasFields?, cachePredicate?, cacheWithContext?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
  • configuration.resolve.extensions[0] should not be empty.
  • configuration.resolveLoader has an unknown property ‘root’. These properties are valid:
    object { alias?, aliasFields?, cachePredicate?, cacheWithContext?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
    at webpack (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma-webpack\node_modules\webpack\lib\webpack.js:19:9)
    at new Plugin (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma-webpack\lib\karma-webpack.js:63:18)
    at invoke (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:75:15)
    at Array.instantiate (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:59:20)
    at get (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:48:43)
    at C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:71:14
    at Array.map (native)
    at Array.invoke (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:70:31)
    at get (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:48:43)
    at instantiatePreprocessor (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\lib\preprocessor.js:55:20)
    at Array.forEach (native)
    at createPreprocessor (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\lib\preprocessor.js:74:20)
    at Array.invoke (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:75:15)
    at get (C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:48:43)
    at C:\Users\jimmybow\myapp2\node_modules\dash-components-archetype-dev\node_modules\karma\node_modules\di\lib\injector.js:71:14
    at Array.map (native)
    14 07 2017 17:55:29.111:INFO [karma]: Karma v1.7.0 server started at http://0.0.0.0:9999/
    14 07 2017 17:55:29.111:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
    14 07 2017 17:55:29.111:ERROR [karma]: Found 1 load error
    [builder:proc:end:1] Command: cross-env NODE_ENV=test karma start node_modules/dash-components-archetype/config/karma/karma.conf.coverage.js
    [builder:builder-core:end:10388] Task: run test-frontend-cov, Error: Command failed: cmd /d /s /c cross-env NODE_ENV=test karma start node_modules/dash-components-archetype/config/karma/karma.conf.coverage.js

[builder:proc:end:1] Command: builder run lint && builder run test-frontend-cov
[builder:builder-core:end:11504] Task: run check, Error: Command failed: cmd /d /s /c builder run lint && builder run test-frontend-cov

npm ERR! Test failed. See above for more details.

npm ERR! Windows_NT 10.0.10586
npm ERR! argv “C:\Program Files\nodejs\node.exe” “C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js” "install"
npm ERR! node v4.4.3
npm ERR! npm v2.15.1
npm ERR! code ELIFECYCLE
npm ERR! myapp2@0.0.1 prepublish: npm test && builder run build-dist && npm run copy-lib
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the myapp2@0.0.1 prepublish script ‘npm test && builder run build-dist && npm run copy-lib’.
npm ERR! This is most likely a problem with the myapp2 package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! npm test && builder run build-dist && npm run copy-lib
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs myapp2
npm ERR! Or if that isn’t available, you can get their info via:
npm ERR!
npm ERR! npm owner ls myapp2
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\jimmybow\myapp2\npm-debug.log

#3

  1. update npm to newest version

  2. use cross-env

change rm -rf lib ===> rmdir /s /q lib
change mkdir -p lib ===> mkdir lib
change cp lib/* myapp ===> copy lib myapp

  1. when using

npm install

the path in metadata.json is

“src\\components\\ExampleComponent.react.js”

, so the dash moudle can’t read it , you need just `

change \\ to /

  1. For __ init __ .py file, you need to remove “https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js” if you want to run your app locally.

then it pass :relaxed:

1 Like
#4

Thanks for documenting @jimmybow! we should update the docs (https://github.com/plotly/dash-docs) and the archetype (https://github.com/plotly/dash-component-archetype) with these changes. Feel free to make a PR if you’d like, otherwise I’ll get around to it in a couple weeks.

1 Like
#5

Expect the changes to easily use in win10 :blush: