Type error: Property 'target' does not exist on type '{ href: string; text: string; }'. React UI

[ozymoz]

Error after typing npm run build. What kind of editing should be done in the editor?

React UI Install nodejs (if not already installed with conda) Install react dependencies: npm install Build react: npm run build Run react: npm start Also run the python server: python server.py or with start_(platform) script

[rsxdalv]

The latest version does not have this error. https://github.com/rsxdalv/tts-generation-webui/blob/main/react-ui/src/components/Header.tsx#L129

[rsxdalv]

I found some other issues with the build that I missed before. There's a new update that fixes those errors and warnings: https://github.com/rsxdalv/tts-generation-webui/pull/244

[ozymoz]

I downloaded new updates with Git. React UI was installed and builded. Gradio is working but React UI can't communicate with Gradio.

Edit

I just did a clean install. After installing React UI, when I run start_windows, the following "api error" errors started to appear. I think these are the problems in React UI's communication with gradio. There were no api error errors in start_windows before installing React UI.

start_windows

Loading extensions: Loaded extension: callback_save_generation_ffmpeg Loaded extension: callback_save_generation_musicgen_ffmpeg Loaded extension: empty_extension Loaded 2 callback_save_generation extensions. Loaded 1 callback_save_generation_musicgen extensions. 2024-01-12 04:13:04 | WARNING | xformers | A matching Triton is not available, some optimizations will not be enabled. Error caught was: No module named 'triton' 2024-01-12 04:13:04 | WARNING | xformers | Triton is not available, some optimizations will not be enabled. This is just a warning: No module named 'triton' C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name open_folder already exists, using open_folder_1 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_to_voices already exists, using save_to_voices_1 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name delete_generation already exists, using delete_generation_1 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name open_folder already exists, using open_folder_2 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_to_voices already exists, using save_to_voices_2 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name delete_generation already exists, using delete_generation_2 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_environment_variables_bark already exists, using save_environment_variables_bark_1 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_environment_variables_bark already exists, using save_environment_variables_bark_2 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_config_bark already exists, using save_config_bark_1 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_config_bark already exists, using save_config_bark_2 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_config_bark already exists, using save_config_bark_3 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_config_bark already exists, using save_config_bark_4 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_config_bark already exists, using save_config_bark_5 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_config_bark already exists, using save_config_bark_6 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\blocks.py:261: UserWarning: api_name save_config_bark already exists, using save_config_bark_7 warnings.warn(f"api_name {api_name} already exists, using {api_name_}") Starting Gradio server... Gradio interface options: inline: False inbrowser: True share: False debug: False enable_queue: True max_threads: 40 auth: None auth_message: None prevent_thread_lock: False show_error: False server_name: 0.0.0.0 server_port: None show_tips: False height: 500 width: 100% favicon_path: None ssl_keyfile: None ssl_certfile: None ssl_keyfile_password: None ssl_verify: True quiet: True show_api: True file_directories: None _frontend: True Running on local URL: http://0.0.0.0:7860 Generating: ''' f1 car ''' Parameters: text : f1 car melody : None model : facebook/audiogen-medium duration : 5 topk : 250 topp : 0 temperature : 1 cfg_coef : 3 seed : 3896331569 use_multi_band_diffusion : False Generated in 7.914 seconds Saving generation to outputs\2024-01-12_04-13-36__musicgen__f1_car\2024-01-12_04-13-36__musicgen__f1_car.ogg Saved generation to outputs\2024-01-12_04-13-36__musicgen__f1_car\2024-01-12_04-13-36__musicgen__f1_car.ogg C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\installer_files\env\lib\site-packages\gradio\processing_utils.py:171: UserWarning: Trying to convert audio automatically from float32 to 16-bit int format. warnings.warn(warning.format(data.dtype))

ReactUI

` C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0_2\tts-generation-webui\react-ui>npm start

tts-generation-webui-react@0.1.0 start next start

▲ Next.js 13.5.6

• Local: http://localhost:3000

  ✓ Ready in 298ms gradio api handler musicgen {"text":"f1 car","model":"facebook/audiogen-medium","duration":5.5,"topk":250,"topp":0,"temperature":1,"cfg_coef":3,"seed":-1,"use_multi_band_diffusion":false,"melody":null} TypeError: Cannot set property WebSocket of #

[rsxdalv]

I read about this issue and I am not yet sure why it doesn't affect me. Are you using the same Node.js as conda? This shouldn't but might affect it. The "main" version is v18 (18.14 to be exact) Also apparently some browsers have a problem with gradio? I am considering switching completely away from gradio.

[ozymoz]

I did a clean installation again. I installed Node.js 18.14.0, but the same errors above appeared, for your information. Gradio is enough for most users but problematic to use in projects for backend. WebSocket structure makes integrations difficult. If ReactUI was working, I could quickly create a backend with HTTP requests. Gradio has some problems in mobile browsers, very rarely in desktop browsers.

[rsxdalv]

That's quite troublesome, I was hoping it would be something simple. As for the warnings about api_names, they are not important but I fixed them with this PR https://github.com/rsxdalv/tts-generation-webui/pull/246. From what I read before the fix for the websocket polyfill should already be OK with version 0.5, but maybe upgrading to 0.10 (current version is 0.6) by doing npm install @gradio/client@0.10.0 could be the fix. By the way, gradio also offers a python library for using the API, so that could be another way to convert it to HTTP.

[rsxdalv]

As for the browsers, I tried Chrome Firefox and Edge so it probably isn't the issue either. I also tried 2 Node.js versions - 18.14 and 18.18 and both worked.

[ozymoz]

I have no problem with the Gradio interface. The following errors occur when I want to use React UI. Current situation.

Node.js

Welcome to Node.js v18.14.0.
Type ".help" for more information.
>

start_windows

Loading extensions:
Loaded extension: callback_save_generation_ffmpeg
Loaded extension: callback_save_generation_musicgen_ffmpeg
Loaded extension: empty_extension
Loaded 2 callback_save_generation extensions.
Loaded 1 callback_save_generation_musicgen extensions.
2024-01-13 06:28:31 | WARNING | xformers | A matching Triton is not available, some optimizations will not be enabled.
Error caught was: No module named 'triton'
2024-01-13 06:28:31 | WARNING | xformers | Triton is not available, some optimizations will not be enabled.
This is just a warning: No module named 'triton'
Starting Gradio server...
Gradio interface options:
  inline:               False
  inbrowser:            True
  share:                False
  debug:                False
  enable_queue:         True
  max_threads:          40
  auth:                 None
  auth_message:         None
  prevent_thread_lock:  False
  show_error:           False
  server_name:          0.0.0.0
  server_port:          None
  show_tips:            False
  height:               500
  width:                100%
  favicon_path:         None
  ssl_keyfile:          None
  ssl_certfile:         None
  ssl_keyfile_password: None
  ssl_verify:           True
  quiet:                True
  show_api:             True
  file_directories:     None
  _frontend:            True

> tts-generation-webui-react@0.1.0 start
> next start

  ▲ Next.js 13.5.6
  - Local:        http://localhost:3000

 ✓ Ready in 1878ms
Running on local URL:  http://0.0.0.0:7860
gradio api handler musicgen {"text":"f1 car launch","model":"facebook/audiogen-medium","duration":1,"topk":250,"topp":0,"temperature":1,"cfg_coef":3,"seed":-1,"use_multi_band_diffusion":false,"melody":null}
TypeError: Cannot set property WebSocket of #<Object> which has only a getter
    at C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:1:4264
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

npm list C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui

+-- @emotion/css@11.10.8
+-- @emotion/react@11.10.8
+-- @emotion/styled@11.10.8
+-- @gradio/client@0.10.0
+-- @material-design-icons/svg@0.14.7
+-- @types/adm-zip@0.5.0
+-- @types/express@4.17.20
+-- @types/node@20.0.0
+-- @types/react-dom@18.2.4
+-- @types/react@18.2.5
+-- adm-zip@0.5.10
+-- autoprefixer@10.4.14
+-- country-flag-icons@1.5.7
+-- eslint-config-next@13.4.1
+-- eslint@8.40.0
+-- express@4.18.2
+-- iconv@3.0.1
+-- music-metadata@8.1.4
+-- next@13.5.6
+-- postcss@8.4.33
+-- react-dom@18.2.0
+-- react@18.2.0
+-- tailwindcss@3.3.2
+-- typescript@5.0.4
`-- wavesurfer.js@7.3.9

pip freeze C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui

absl-py==2.0.0
accelerate==0.12.0
addict==2.4.0
aenum==3.1.15
aiofiles==23.2.1
aiohttp==3.9.1
aiosignal==1.3.1
altair==5.2.0
annotated-types==0.6.0
antlr4-python3-runtime==4.8
anyio==3.7.1
asttokens==2.4.1
async-timeout==4.0.3
attrs==23.2.0
audioread==3.0.1
basicsr==1.4.2
beautifulsoup4==4.12.2
bitarray==2.9.2
blendmodes==2022
blinker==1.7.0
boltons==23.1.1
cachetools==5.3.2
certifi==2023.11.17
cffi==1.16.0
chardet==4.0.0
charset-normalizer==3.3.2
clean-fid==0.1.29
click==8.1.7
cmake==3.28.1
colorama==0.4.6
coloredlogs==15.0.1
contourpy==1.2.0
cycler==0.12.1
Cython==3.0.8
decorator==5.1.1
deprecation==2.1.0
einops==0.7.0
elevenlabs==0.2.27
exceptiongroup==1.2.0
executing==2.0.1
facexlib==0.3.0
fairseq==0.12.2
faiss-cpu==1.7.3
fastapi==0.108.0
ffmpeg-python==0.2.0
ffmpy==0.3.1
filelock==3.13.1
filterpy==1.4.5
Flask==3.0.0
Flask-Cors==4.0.0
flatbuffers==23.5.26
font-roboto==0.0.1
fonts==0.0.3
fonttools==4.47.0
frozenlist==1.4.1
fsspec==2023.12.2
ftfy==6.1.3
future==0.18.3
gdown==4.7.1
gfpgan==1.3.8
gin==0.1.6
gin-config==0.5.0
gitdb==4.0.11
GitPython==3.1.27
google-auth==2.26.1
google-auth-oauthlib==1.2.0
gradio==3.34.0
gradio_client==0.5.0
grpcio==1.60.0
gTTS==2.5.0
h11==0.12.0
httpcore==0.15.0
httpx==0.23.0
huggingface-hub==0.20.2
humanfriendly==10.0
hydra-core==1.0.7
idna==2.10
imageio==2.33.1
importlib-metadata==7.0.1
importlib-resources==6.1.1
inflection==0.5.1
invisible-watermark==0.2.0
ipython==8.20.0
itsdangerous==2.1.2
jedi==0.19.1
Jinja2==3.1.2
joblib==1.3.2
json5==0.9.14
jsonmerge==1.8.0
jsonschema==4.20.0
jsonschema-specifications==2023.12.1
kiwisolver==1.4.5
kornia==0.6.7
lark==1.1.2
lazy_loader==0.3
librosa==0.9.1
lightning-utilities==0.10.0
linkify-it-py==2.0.2
llvmlite==0.39.0
lmdb==1.4.1
local-attention==1.9.0
lxml==5.1.0
Markdown==3.5.1
markdown-it-py==2.2.0
MarkupSafe==2.1.3
matplotlib==3.8.2
matplotlib-inline==0.1.6
mdit-py-plugins==0.3.3
mdurl==0.1.2
mega.py==1.0.8
mpmath==1.3.0
multidict==6.0.4
mypy-extensions==1.0.0
networkx==3.2.1
noisereduce==3.0.0
numba==0.56.4
numpy==1.23.5
oauthlib==3.2.2
omegaconf==2.0.6
onnx==1.15.0
onnxruntime-gpu==1.16.3
open-clip-torch==2.24.0
opencv-contrib-python==4.9.0.80
opencv-python==4.9.0.80
orjson==3.9.10
packaging==23.2
pandas==2.1.4
parso==0.8.3
pathlib==1.0.1
piexif==1.1.3
Pillow==9.4.0
platformdirs==4.1.0
pooch==1.8.0
portalocker==2.8.2
praat-parselmouth==0.4.3
prompt-toolkit==3.0.43
protobuf==4.23.4
psutil==5.9.7
pure-eval==0.2.2
pyasn1==0.5.1
pyasn1-modules==0.3.0
pycparser==2.21
pycryptodome==3.19.1
pydantic==2.5.3
pydantic_core==2.14.6
pyDeprecate==0.3.2
pydub==0.25.1
Pygments==2.17.2
pyparsing==3.1.1
pyre-extensions==0.0.29
pyreadline3==3.4.1
PySimpleGUI==4.60.5
PySocks==1.7.1
python-dateutil==2.8.2
python-multipart==0.0.6
pytorch-lightning==1.7.6
pytz==2023.3.post1
PyWavelets==1.5.0
pywin32==306
pyworld==0.3.4
PyYAML==6.0.1
realesrgan==0.3.0
referencing==0.32.1
regex==2023.12.25
requests==2.31.0
requests-oauthlib==1.3.1
resampy==0.4.2
resize-right==0.0.2
rfc3986==1.5.0
rpds-py==0.16.2
rsa==4.9
sacrebleu==2.4.0
safetensors==0.4.1
scikit-image==0.19.2
scikit-learn==1.3.2
scipy==1.9.3
semantic-version==2.10.0
sentencepiece==0.1.99
six==1.16.0
smmap==5.0.1
sniffio==1.3.0
sounddevice==0.4.6
soundfile==0.12.1
soupsieve==2.5
stack-data==0.6.3
starlette==0.32.0.post1
sympy==1.12
tabulate==0.9.0
tb-nightly==2.16.0a20240106
tenacity==5.1.5
tensorboard==2.15.1
tensorboard-data-server==0.7.2
tensorboard-plugin-wit==1.8.1
tensorboardX==2.6.2.2
tf_keras-nightly==2.16.0.dev2024010610
threadpoolctl==3.2.0
tifffile==2023.12.9
timm==0.6.7
tokenizers==0.12.1
tomesd==0.1.3
tomli==2.0.1
toolz==0.12.0
torch==2.0.0
torchaudio==2.0.1
torchcrepe==0.0.20
torchdiffeq==0.2.3
torchgen==0.0.1
torchmetrics==1.2.1
torchsde==0.2.5
torchvision==0.16.2
tornado==6.4
tqdm==4.66.1
traitlets==5.14.1
trampoline==0.1.2
transformers==4.30.2
triton @ file:///C:/Users/xxxxxx/Desktop/one-click-installers-tts-6.0/triton-2.0.0-cp310-cp310-win_amd64.whl#sha256=91a6ec395022743269c942df7af01b210f642fb633d146a811be05a455adbae2
typing-inspect==0.9.0
typing_extensions==4.9.0
tzdata==2023.4
uc-micro-py==1.0.2
urllib3==1.26.18
uvicorn==0.25.0
Wave==0.0.2
wcwidth==0.2.13
websockets==11.0.3
Werkzeug==3.0.1
xformers==0.0.20
yapf==0.40.2
yarl==1.9.4
zipp==3.17.0

[rsxdalv]

Did a fresh install with the default 0.6.0 and then installed 0.10.0 and still worked.

Now what was the actual issue was that you used a newer nextjs version. In a debugging situation this was quite an important point, and it does not happen when installing npm dependencies regularly with npm install. There's a specific version both in package.json and package-lock.json, "next": "13.4.1". Gradio will need to fix the newer nextjs version incompatibility, but for now using the package.json version is the fix.

The fix is:

delete node_modules
delete .next
restore package.json
restore package-lock.json
npm install
npm run build

npm list:

+-- @emotion/css@11.10.8
+-- @emotion/react@11.10.8
+-- @emotion/styled@11.10.8
+-- @gradio/client@0.10.0
+-- @material-design-icons/svg@0.14.7
+-- @types/adm-zip@0.5.0
+-- @types/express@4.17.20
+-- @types/node@20.0.0
+-- @types/react-dom@18.2.4
+-- @types/react@18.2.5
+-- adm-zip@0.5.10
+-- autoprefixer@10.4.14
+-- country-flag-icons@1.5.7
+-- eslint-config-next@13.4.1
+-- eslint@8.40.0
+-- express@4.18.2
+-- iconv@3.0.1
+-- music-metadata@8.1.4
+-- next@13.4.1
+-- postcss@8.4.23
+-- react-dom@18.2.0
+-- react@18.2.0
+-- tailwindcss@3.3.2
+-- typescript@5.0.4
`-- wavesurfer.js@7.3.9

pip freeze

absl-py==1.4.0
accelerate==0.26.1
aiofiles==23.2.1
aiohttp==3.9.1
aiosignal==1.3.1
altair==5.2.0
annotated-types==0.6.0
antlr4-python3-runtime==4.9.3
anyio==3.7.1
async-timeout==4.0.3
attrs==23.2.0
audiocraft @ git+https://git@github.com/facebookresearch/audiocraft@e96018613ac82b1afe0f0cce7861dfe08ba2b3bf
audiolm-pytorch==1.2.28
audioread==3.0.1
av==11.0.0
bark-hubert-quantizer @ git+https://github.com/rsxdalv/bark-voice-cloning-HuBERT-quantizer@a8cd83859ffded0be8b4afcf00dbdb426e9aa0df
beartype==0.16.4
bitarray==2.9.2
blis==0.7.11
boto3==1.34.18
botocore==1.34.18
Brotli @ file:///C:/Windows/Temp/abs_63l7912z0e/croots/recipe/brotli-split_1659616056886/work
cachetools==5.3.2
catalogue==2.0.10
certifi @ file:///home/conda/feedstock_root/build_artifacts/certifi_1700303426725/work/certifi
cffi @ file:///C:/b/abs_924gv1kxzj/croot/cffi_1700254355075/work
charset-normalizer @ file:///tmp/build/80754af9/charset-normalizer_1630003229654/work
click==8.1.7
cloudpickle==3.0.0
colorama==0.4.6
colorlog==6.8.0
confection==0.1.4
contourpy==1.2.0
cryptography @ file:///C:/b/abs_e8cnom_zw_/croot/cryptography_1702071486468/work
cycler==0.12.1
cymem==2.0.8
Cython==0.29.37
decorator==5.1.1
demucs==4.0.1
docopt==0.6.2
dora_search==0.1.12
einops==0.7.0
ema-pytorch==0.3.2
encodec==0.1.1
exceptiongroup==1.2.0
fairseq @ https://github.com/Sharrnah/fairseq/releases/download/v0.12.4/fairseq-0.12.4-cp310-cp310-win_amd64.whl#sha256=48486cff0f70bb57b500cd1e3fd9addba1135187e888bcf1eb3f056c41bfd45a
faiss-cpu==1.7.4
fastapi==0.106.0
ffmpeg-python==0.2.0
ffmpy==0.3.1
filelock @ file:///C:/b/abs_f2gie28u58/croot/filelock_1700591233643/work
flashy==0.0.2
fonttools==4.47.2
frozenlist==1.4.1
fsspec==2023.12.2
functorch==2.0.0
funcy==2.0
future==0.18.3
gmpy2 @ file:///C:/ci/gmpy2_1645438895476/work
google-auth==2.26.2
google-auth-oauthlib==1.2.0
gradio==3.35.2
gradio_client==0.8.0
grpcio==1.60.0
h11==0.14.0
httpcore==1.0.2
httpx==0.26.0
huggingface-hub==0.20.2
hydra-colorlog==1.2.0
hydra-core==1.3.2
idna @ file:///C:/b/abs_bdhbebrioa/croot/idna_1666125572046/work
inflect==7.0.0
Jinja2 @ file:///C:/b/abs_7cdis66kl9/croot/jinja2_1666908141852/work
jmespath==1.0.1
joblib==1.3.2
json5==0.9.14
jsonschema==4.20.0
jsonschema-specifications==2023.12.1
julius==0.2.7
kiwisolver==1.4.5
lameenc==1.7.0
langcodes==3.3.0
lazy_loader==0.3
librosa==0.9.2
lightning-utilities==0.10.0
linkify-it-py==2.0.2
lion-pytorch==0.1.2
llvmlite==0.39.0
local-attention==1.9.0
lxml==5.1.0
Markdown==3.5.2
markdown-it-py==2.2.0
MarkupSafe @ file:///C:/b/abs_ecfdqh67b_/croot/markupsafe_1704206030535/work
matplotlib==3.8.2
matplotlib-inline==0.1.6
mdit-py-plugins==0.3.3
mdurl==0.1.2
mkl-fft @ file:///C:/b/abs_19i1y8ykas/croot/mkl_fft_1695058226480/work
mkl-random @ file:///C:/b/abs_edwkj1_o69/croot/mkl_random_1695059866750/work
mkl-service==2.4.0
mpmath @ file:///C:/b/abs_7833jrbiox/croot/mpmath_1690848321154/work
msgpack==1.0.7
multidict==6.0.4
murmurhash==1.0.10
mypy-extensions==1.0.0
networkx @ file:///C:/b/abs_e6gi1go5op/croot/networkx_1690562046966/work
num2words==0.5.13
numba==0.56.4
numpy==1.23.5
oauthlib==3.2.2
omegaconf==2.3.0
openunmix==1.2.1
orjson==3.9.10
packaging==23.2
pandas==2.1.4
pathlib_abc==0.1.1
pathy==0.11.0
Pillow==9.3.0
platformdirs==4.1.0
pooch==1.8.0
portalocker==2.8.2
praat-parselmouth==0.4.3
preshed==3.0.9
progressbar==2.5
protobuf==4.23.4
psutil==5.9.7
pyasn1==0.4.8
pyasn1-modules==0.2.8
pycparser @ file:///tmp/build/80754af9/pycparser_1636541352034/work
pydantic==1.10.13
pydantic_core==2.14.6
pydub==0.25.1
Pygments==2.17.2
pyOpenSSL @ file:///C:/b/abs_08f38zyck4/croot/pyopenssl_1690225407403/work
pyparsing==3.1.1
pyre-extensions==0.0.29
PySocks @ file:///C:/ci_310/pysocks_1642089375450/work
python-dateutil==2.8.2
python-dotenv==1.0.0
python-multipart==0.0.6
pytz==2023.3.post1
pywin32==306
pyworld==0.3.4
PyYAML==6.0.1
referencing==0.32.1
regex==2023.12.25
requests @ file:///C:/b/abs_316c2inijk/croot/requests_1690400295842/work
requests-oauthlib==1.3.1
resampy==0.4.2
retrying==1.3.4
rotary-embedding-torch==0.5.3
rpds-py==0.17.1
rsa==4.9
rvc-beta @ git+https://github.com/rsxdalv/Retrieval-based-Voice-Conversion-WebUI@b27fea3d85a3f7f1e33be031c6bac206b080e8ca
s3transfer==0.10.0
sacrebleu==2.4.0
safetensors==0.3.1
scikit-learn==1.3.2
scipy==1.9.3
semantic-version==2.10.0
sentencepiece==0.1.99
six==1.16.0
smart-open==6.4.0
sniffio==1.3.0
soundfile==0.12.1
soxr==0.3.7
spacy==3.5.2
spacy-legacy==3.0.12
spacy-loggers==1.0.5
srsly==2.4.8
starlette==0.27.0
submitit==1.5.1
suno-bark @ git+https://github.com/rsxdalv/bark@0d91823ead3d87c317f12d01d325fca9408c669e
sympy @ file:///C:/b/abs_82njkonm7f/croot/sympy_1701397685028/work
tabulate==0.9.0
tensorboard==2.15.1
tensorboard-data-server==0.7.2
tensorboard-plugin-wit==1.8.1
tensorboardX==2.6.2.2
thinc==8.1.12
threadpoolctl==3.2.0
tokenizers==0.13.3
toolz==0.12.0
torch==2.0.0
torchaudio==2.0.0
torchcrepe @ git+https://github.com/rsxdalv/torchcrepe@9cc34800fe2f2fce2f6f665dc8a4dfc48a371e39
torchgen==0.0.1
torchmetrics==1.3.0
torchvision==0.15.0
tornado==6.4
TorToiSe @ git+https://github.com/rsxdalv/tortoise-tts@518e73b64516c6d81bb325df22104a91128963c5
tqdm==4.66.1
traitlets==5.14.1
transformers==4.31.0
treetable==0.2.5
typer==0.7.0
typing-inspect==0.9.0
typing_extensions @ file:///C:/b/abs_17w291e_98/croot/typing_extensions_1705005680808/work
tzdata==2023.4
uc-micro-py==1.0.2
Unidecode==1.3.8
urllib3 @ file:///C:/b/abs_9cmlsrm3ys/croot/urllib3_1698257595508/work
uvicorn==0.21.1
vector-quantize-pytorch==1.12.5
vocos==0.0.2
wasabi==1.1.2
websockets==11.0.3
Werkzeug==2.3.8
win-inet-pton @ file:///C:/ci_310/win_inet_pton_1642658466512/work
xformers==0.0.19
yarl==1.9.4

[ozymoz]

I guess you did not install it with quick installer. Quick installer downloads different versions. I change them myself but this time npm install gives error. When I fix it, it installs higher versions of next. Just today I did 50 clean installations and tried to install the versions you said manually. But this time npm build gave an error in most repetitions. When I did npm fix, a different version of next was installed, this time react ui did not work. If you want, I can write a comparison between quick installer and the versions you said.

Edit @gradio/client@0.10.0 next@13.4.1 node v18.14.0

ReactUI initializes my request, creates the file but then gives an error. Note: I can access the file from my computer directory. I think we are almost done with the big problems :)

> tts-generation-webui-react@0.1.0 start
> next start

- ready started server on 0.0.0.0:3000, url: http://localhost:3000
Running on local URL:  http://0.0.0.0:7860
gradio api handler musicgen {"text":"baby cry","model":"facebook/audiogen-medium","duration":1,"topk":250,"topp":0,"temperature":1,"cfg_coef":3,"seed":-1,"use_multi_band_diffusion":false,"melody":null}
Generating: ''' baby cry '''
Parameters:
melody : None
text : baby cry
model : facebook/audiogen-medium
duration : 1
topk : 250
topp : 0
temperature : 1
cfg_coef : 3
seed : 3732800555
use_multi_band_diffusion : False
Generated in 2.861 seconds
Saving generation to outputs\2024-01-14_02-12-15__musicgen__baby_cry\2024-01-14_02-12-15__musicgen__baby_cry.ogg
Saved generation to outputs\2024-01-14_02-12-15__musicgen__baby_cry\2024-01-14_02-12-15__musicgen__baby_cry.ogg
C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\installer_files\env\lib\site-packages\gradio\processing_utils.py:171: UserWarning: Trying to convert audio automatically from float32 to 16-bit int format.
  warnings.warn(warning.format(data.dtype))
C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:1226
    } else if (typeof d === "object" && d.path) {
                                          ^

TypeError: Cannot read properties of null (reading 'path')
    at C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:1226:43
    at Array.map (<anonymous>)
    at transform_output (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:1218:15)
    at websocket.onmessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:710:45)
    at callListener (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:2023:14)
    at WebSocket.onMessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:1958:9)
    at WebSocket.emit (node:events:513:28)
    at Receiver.receiverOnMessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:3000:22)
    at Receiver.emit (node:events:513:28)
    at Receiver.dataMessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:1335:14)

Node.js v18.14.0
Error: read ECONNRESET
    at TCP.onStreamRead (node:internal/stream_base_commons:217:20) {
  errno: -4077,
  code: 'ECONNRESET',
  syscall: 'read'
}

[rsxdalv]

I guess you did not install it with quick installer. Quick installer downloads different versions. I change them myself but this time npm install gives error. When I fix it, it installs higher versions of next. Just today I did 50 clean installations and tried to install the versions you said manually. But this time npm build gave an error in most repetitions. When I did npm fix, a different version of next was installed, this time react ui did not work. If you want, I can write a comparison between quick installer and the versions you said. Also, if you can do a special work for me, I am ready to pay for it. You can reach me at developer@ozymoz.com.

Edit @gradio/client@0.10.0 next@13.4.1 node v18.14.0

ReactUI initializes my request, creates the file but then gives an error. Note: I can access the file from my computer directory. I think we are almost done with the big problems :)

> tts-generation-webui-react@0.1.0 start
> next start

- ready started server on 0.0.0.0:3000, url: http://localhost:3000
Running on local URL:  http://0.0.0.0:7860
gradio api handler musicgen {"text":"baby cry","model":"facebook/audiogen-medium","duration":1,"topk":250,"topp":0,"temperature":1,"cfg_coef":3,"seed":-1,"use_multi_band_diffusion":false,"melody":null}
Generating: ''' baby cry '''
Parameters:
melody : None
text : baby cry
model : facebook/audiogen-medium
duration : 1
topk : 250
topp : 0
temperature : 1
cfg_coef : 3
seed : 3732800555
use_multi_band_diffusion : False
Generated in 2.861 seconds
Saving generation to outputs\2024-01-14_02-12-15__musicgen__baby_cry\2024-01-14_02-12-15__musicgen__baby_cry.ogg
Saved generation to outputs\2024-01-14_02-12-15__musicgen__baby_cry\2024-01-14_02-12-15__musicgen__baby_cry.ogg
C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\installer_files\env\lib\site-packages\gradio\processing_utils.py:171: UserWarning: Trying to convert audio automatically from float32 to 16-bit int format.
  warnings.warn(warning.format(data.dtype))
C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:1226
    } else if (typeof d === "object" && d.path) {
                                          ^

TypeError: Cannot read properties of null (reading 'path')
    at C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:1226:43
    at Array.map (<anonymous>)
    at transform_output (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:1218:15)
    at websocket.onmessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\327.js:710:45)
    at callListener (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:2023:14)
    at WebSocket.onMessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:1958:9)
    at WebSocket.emit (node:events:513:28)
    at Receiver.receiverOnMessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:3000:22)
    at Receiver.emit (node:events:513:28)
    at Receiver.dataMessage (C:\Users\xxxxxx\Desktop\one-click-installers-tts-6.0\tts-generation-webui\react-ui\.next\server\chunks\986.js:1335:14)

Node.js v18.14.0
Error: read ECONNRESET
    at TCP.onStreamRead (node:internal/stream_base_commons:217:20) {
  errno: -4077,
  code: 'ECONNRESET',
  syscall: 'read'
}

I reproduced the same errors, including this one. But for me the only way to resolve this error was as I said - package-lock.json identical versions, anything other than that broke. That's why I deleted/renamed node_modules and installed with that exact setup. I don't know which project is so skewed, but this is the most fragile thing I've seen in a while.

I'm really curious about the errors from one click installers that prevent that from just getting installed. For this debugging I did a fresh install with an installer and maybe I ignored some things but it just worked (I had to add a few lines to autostart the web UI and build it after installing). Also, in my experience, npm fix breaks things, although sometimes there's no other choice but to use it.

[ozymoz]

After npm install, ignore all errors and get build working. Thank you for your help.