rjsf-team / react-jsonschema-form

A React component for building Web forms from JSON Schema.
https://rjsf-team.github.io/react-jsonschema-form/
Apache License 2.0
14.28k stars 2.18k forks source link

Playground broken on a fresh install #1911

Closed erunion closed 4 years ago

erunion commented 4 years ago

Prerequisites

Description

Playground does not load on a fresh install and am unable to develop locally.

Steps to Reproduce

  1. Clone repository
  2. Run npm install
  3. Run npm start

Expected behavior

Playground should load

Actual behavior

[jon@jon-mbp ~/code/react-jsonschema-form(master)]$ npm start

> react-jsonschema-form@2.0.0-alpha.1 start /Users/jon/code/react-jsonschema-form
> lerna run start --stream --parallel

lerna notice cli v3.18.4
lerna info Executing command in 5 packages: "npm run start"
@rjsf/antd: > @rjsf/antd@2.2.1 start /Users/jon/code/react-jsonschema-form/packages/antd
@rjsf/antd: > concurrently "npm:build:* -- --watch"
@rjsf/fluent-ui: > @rjsf/fluent-ui@2.2.1 start /Users/jon/code/react-jsonschema-form/packages/fluent-ui
@rjsf/fluent-ui: > tsdx watch
@rjsf/core: > @rjsf/core@2.2.1 start /Users/jon/code/react-jsonschema-form/packages/core
@rjsf/core: > concurrently "npm:build:* -- --watch"
@rjsf/material-ui: > @rjsf/material-ui@2.2.1 start /Users/jon/code/react-jsonschema-form/packages/material-ui
@rjsf/material-ui: > tsdx watch
@rjsf/playground: > @rjsf/playground@2.2.1 start /Users/jon/code/react-jsonschema-form/packages/playground
@rjsf/playground: > webpack-dev-server --open --config webpack.config.dev.js
@rjsf/antd: [build:cjs] 
@rjsf/antd: [build:cjs] > @rjsf/antd@2.2.1 build:cjs /Users/jon/code/react-jsonschema-form/packages/antd
@rjsf/antd: [build:cjs] > cross-env NODE_ENV=production BABEL_ENV=cjs babel --extensions ".js,.jsx,.ts,.tsx" ./src --out-dir ./dist/cjs "--watch"
@rjsf/antd: [build:cjs] 
@rjsf/antd: [build:es] 
@rjsf/antd: [build:es] > @rjsf/antd@2.2.1 build:es /Users/jon/code/react-jsonschema-form/packages/antd
@rjsf/antd: [build:es] > cross-env NODE_ENV=production BABEL_ENV=es babel --extensions ".js,.jsx,.ts,.tsx" ./src --out-dir ./dist/es "--watch"
@rjsf/antd: [build:es] 
@rjsf/core: [build:es:lib] 
@rjsf/core: [build:es:lib] > @rjsf/core@2.2.1 build:es:lib /Users/jon/code/react-jsonschema-form/packages/core
@rjsf/core: [build:es:lib] > cross-env NODE_ENV=production BABEL_ENV=es babel --extensions ".js,.jsx,.ts,.tsx" ./src --out-dir ./lib "--watch"
@rjsf/core: [build:es:lib] 
@rjsf/core: [build:cjs] 
@rjsf/core: [build:cjs] > @rjsf/core@2.2.1 build:cjs /Users/jon/code/react-jsonschema-form/packages/core
@rjsf/core: [build:cjs] > cross-env NODE_ENV=production BABEL_ENV=cjs babel --extensions ".js,.jsx,.ts,.tsx" ./src --out-dir ./dist/cjs "--watch"
@rjsf/core: [build:cjs] 
@rjsf/core: [build:es] 
@rjsf/core: [build:es] > @rjsf/core@2.2.1 build:es /Users/jon/code/react-jsonschema-form/packages/core
@rjsf/core: [build:es] > cross-env NODE_ENV=production BABEL_ENV=es babel --extensions ".js,.jsx,.ts,.tsx" ./src --out-dir ./dist/es "--watch"
@rjsf/core: [build:es] 
@rjsf/core: [build:cjs] Browserslist: caniuse-lite is outdated. Please run next command `npm update`
@rjsf/fluent-ui: - 
@rjsf/core: [build:es:lib] Browserslist: caniuse-lite is outdated. Please run next command `npm update`
@rjsf/core: [build:es] Browserslist: caniuse-lite is outdated. Please run next command `npm update`
@rjsf/material-ui: - 
@rjsf/playground: ℹ 「wds」: Project is running at http://localhost:8080/
@rjsf/playground: ℹ 「wds」: webpack output is served from /
@rjsf/playground: ℹ 「wds」: Content not from webpack is served from /Users/jon/code/react-jsonschema-form/packages/playground/build
@rjsf/playground: ℹ 「wdm」: wait until bundle finished: /
@rjsf/playground: Browserslist: caniuse-lite is outdated. Please run next command `npm update`
@rjsf/core: [build:es:lib] Successfully compiled 41 files with Babel.
@rjsf/core: [build:es] Successfully compiled 41 files with Babel.
@rjsf/antd: [build:es] Successfully compiled 28 files with Babel.
@rjsf/material-ui: - Compiling modules...
@rjsf/antd: [build:cjs] Successfully compiled 28 files with Babel.
@rjsf/core: [build:cjs] Successfully compiled 41 files with Babel.
@rjsf/material-ui: Browserslist: caniuse-lite is outdated. Please run next command `npm update`
@rjsf/fluent-ui: - Compiling modules...
@rjsf/fluent-ui: Browserslist: caniuse-lite is outdated. Please run next command `npm update`
@rjsf/playground: ✖ 「wdm」: Hash: 3f1bae8ca8c9c5e4bdaa
@rjsf/playground: Version: webpack 4.20.2
@rjsf/playground: Time: 42984ms
@rjsf/playground: Built at: 07/14/2020 2:59:21 PM
@rjsf/playground:                Asset       Size  Chunks             Chunk Names
@rjsf/playground:     editor.worker.js    397 KiB          [emitted]  
@rjsf/playground: editor.worker.js.map    405 KiB          [emitted]  
@rjsf/playground:       json.worker.js    769 KiB          [emitted]  
@rjsf/playground:   json.worker.js.map    780 KiB          [emitted]  
@rjsf/playground:              main.js   12.8 MiB    main  [emitted]  main
@rjsf/playground:                 0.js    164 KiB       0  [emitted]  
@rjsf/playground:          main.js.map   12.4 MiB    main  [emitted]  main
@rjsf/playground:             0.js.map    166 KiB       0  [emitted]  
@rjsf/playground:           index.html  591 bytes          [emitted]  
@rjsf/playground: Entrypoint main = main.js main.js.map
@rjsf/playground: [../antd/dist/es/index.js] 3.75 KiB {main} [built]
@rjsf/playground: [../fluent-ui/dist/index.js] 196 bytes {main} [built]
@rjsf/playground: [./node_modules/react-dom/index.js] 1.33 KiB {main} [built]
@rjsf/playground: [./node_modules/react/index.js] 190 bytes {main} [built]
@rjsf/playground: [./node_modules/strip-ansi/index.js] 161 bytes {main} [built]
@rjsf/playground: [./node_modules/webpack-dev-server/client/index.js?http://localhost:8080] (webpack)-dev-server/client?http://localhost:8080 4.29 KiB {main} [built]
@rjsf/playground: [./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.51 KiB {main} [built]
@rjsf/playground: [./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.53 KiB {main} [built]
@rjsf/playground: [./node_modules/webpack-dev-server/client/utils/log.js] (webpack)-dev-server/client/utils/log.js 964 bytes {main} [built]
@rjsf/playground: [1] multi (webpack)-dev-server/client?http://localhost:8080 ./src/index 40 bytes {main} [built]
@rjsf/playground: [./node_modules/webpack-dev-server/client/utils/reloadApp.js] (webpack)-dev-server/client/utils/reloadApp.js 1.59 KiB {main} [built]
@rjsf/playground: [./node_modules/webpack-dev-server/client/utils/sendMessage.js] (webpack)-dev-server/client/utils/sendMessage.js 402 bytes {main} [built]
@rjsf/playground: [./node_modules/webpack/hot sync ^\.\/log$] (webpack)/hot sync nonrecursive ^\.\/log$ 170 bytes {main} [built]
@rjsf/playground: [./src/app.js] 23.8 KiB {main} [built]
@rjsf/playground: [./src/index.js] 3.19 KiB {main} [built]
@rjsf/playground:     + 2240 hidden modules
@rjsf/playground: ERROR in ../fluent-ui/dist/index.js
@rjsf/playground: Module not found: Error: Can't resolve './fluent-ui.cjs.development.js' in '/Users/jon/code/react-jsonschema-form/packages/fluent-ui/dist'
@rjsf/playground:  @ ../fluent-ui/dist/index.js 7:19-60
@rjsf/playground:  @ ./src/index.js
@rjsf/playground:  @ multi ./src/index
@rjsf/playground: ERROR in ../material-ui/dist/index.js
@rjsf/playground: Module not found: Error: Can't resolve './material-ui.cjs.development.js' in '/Users/jon/code/react-jsonschema-form/packages/material-ui/dist'
@rjsf/playground:  @ ../material-ui/dist/index.js 7:19-62
@rjsf/playground:  @ ./src/index.js
@rjsf/playground:  @ multi ./src/index
@rjsf/playground: ERROR in ./src/index.js
@rjsf/playground: Module not found: Error: Can't resolve '@rjsf/semantic-ui' in '/Users/jon/code/react-jsonschema-form/packages/playground/src'
@rjsf/playground:  @ ./src/index.js 4:0-54 79:11-19
@rjsf/playground:  @ multi ./src/index
@rjsf/playground: Child html-webpack-plugin for "index.html":
@rjsf/playground:      1 asset
@rjsf/playground:     Entrypoint undefined = index.html
@rjsf/playground:     [./node_modules/html-webpack-plugin/lib/loader.js!./index.html] 746 bytes {0} [built]
@rjsf/playground:     [./node_modules/lodash/lodash.js] 528 KiB {0} [built]
@rjsf/playground:     [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 509 bytes {0} [built]
@rjsf/playground:     [./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 519 bytes {0} [built]
@rjsf/playground: Child vs/editor/editor:
@rjsf/playground:                    Asset     Size  Chunks             Chunk Names
@rjsf/playground:         editor.worker.js  397 KiB    main  [emitted]  main
@rjsf/playground:     editor.worker.js.map  405 KiB    main  [emitted]  main
@rjsf/playground:     Entrypoint main = editor.worker.js editor.worker.js.map
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/diff/diff.js] 44.2 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/errors.js] 2.88 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/iterator.js] 5.36 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/lifecycle.js] 1.82 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/platform.js] 2.97 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/types.js] 4.43 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/uri.js] 21.2 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/worker/simpleWorker.js] 11.9 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/core/range.js] 12.6 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/model/wordHelper.js] 4.4 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/modes/linkComputer.js] 10.9 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/modes/supports/inplaceReplaceSupport.js] 3.23 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/services/editorSimpleWorker.js] 22.1 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/standalone/standaloneBase.js] 1.77 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/editor.worker.js] 1.06 KiB {main} [built]
@rjsf/playground:         + 22 hidden modules
@rjsf/playground: Child vs/language/json/jsonWorker:
@rjsf/playground:                  Asset     Size  Chunks             Chunk Names
@rjsf/playground:         json.worker.js  769 KiB    main  [emitted]  main
@rjsf/playground:     json.worker.js.map  780 KiB    main  [emitted]  main
@rjsf/playground:     Entrypoint main = json.worker.js json.worker.js.map
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/platform.js] 2.97 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/types.js] 4.43 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/base/common/worker/simpleWorker.js] 11.9 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/core/position.js] 4.39 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/core/range.js] 12.6 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/diff/diffComputer.js] 20.3 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/model/mirrorTextModel.js] 5.03 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/model/wordHelper.js] 4.4 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/common/services/editorSimpleWorker.js] 22.1 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/editor/editor.worker.js] 1.06 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/language/json/_deps/jsonc-parser/main.js] 5.74 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/language/json/_deps/vscode-json-languageservice/jsonLanguageService.js] 4.19 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/language/json/_deps/vscode-languageserver-types/main.js] 52 KiB {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/language/json/json.worker.js] 642 bytes {main} [built]
@rjsf/playground:     [./node_modules/monaco-editor/esm/vs/language/json/jsonWorker.js] 5.08 KiB {main} [built]
@rjsf/playground:         + 47 hidden modules
@rjsf/playground: ℹ 「wdm」: Failed to compile.
@rjsf/playground: ℹ 「wdm」: Compiling...

Version

Running the latest master with Node v10.16.0.

epicfaace commented 4 years ago

Can you try

npm install
npm run build
npm start
erunion commented 4 years ago

That worked! PR'ing an update to the contribution docs to fix this: https://github.com/rjsf-team/react-jsonschema-form/pull/1913

ValYouW commented 4 years ago

@epicfaace Hi, when running npm run build from the root folder I get this error:

@rjsf/material-ui: 'tsdx' is not recognized as an internal or external command,
@rjsf/material-ui: operable program or batch file.
@rjsf/material-ui: npm ERR! code ELIFECYCLE
@rjsf/material-ui: npm ERR! errno 1
@rjsf/material-ui: npm ERR! @rjsf/material-ui@2.2.1 start: `tsdx watch`

But if I run npm run build from within packages/material-ui it works. Any ideas?

epicfaace commented 4 years ago

@ValYouW which operating system are you using? If you run npm install from the root folder, it should install all required dependencies for all subpackages through Lerna.

ValYouW commented 4 years ago

I'm running on Windows thru git bash. Yeah, I run npm install from root, and all dependencies gets installed, otherwise it wouldn't have worked when I "cd" into material-ui package... Not that important as I "cd" manually into all packages and run "npm run build", it works perfectly. I'll see, maybe my npm version.

ErQrYfkrju commented 4 years ago

on current master(32717c7) unable to run playground from https://react-jsonschema-form.readthedocs.io/en/latest/contributing/ npm install && npm run build work correctly npm start removes dist folder for fluent-ui bootstrap-4 and material-ui