-
-
Notifications
You must be signed in to change notification settings - Fork 2.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[bug] WebSocket HMR not working as expected with Nuxt #11165
Comments
I found a workaround: {
devServer: {
host: isMobile ? '0.0.0.0' : undefined,
},
hooks: {
'vite:extend': function ({ config }) {
if (config.server && config.server.hmr && config.server.hmr !== true) {
config.server.hmr.protocol = 'ws'
config.server.hmr.host = '192.168.XXX.XXX'
config.server.hmr.port = 3000
}
},
},
vite: {
clearScreen: false,
envPrefix: ['VITE_', 'TAURI_'],
server: {
strictPort: true,
watch: {
ignored: ['**/src-tauri/**'],
},
},
},
} But I think |
Hey @Sun-ZhenXing can you share a working example, as I am getting a white screen creating a nuxt based app for mobile |
I dig a little bit further and saw those errors as the culprit of the white screen 11-18 01:04:14.193 15907 15907 E Tauri/Console: File: - Line 138 - Msg: Uncaught TypeError: Cannot redefine property: postMessage |
@gkkirilov Im suspecting about the blank screen is caused (correct me if Im wrong, those folders dont need to be generated for dev but I suspect Tauri needs it for app dev) because SECOND STATE: (Notice that The wipe of both folders occurs exactly at this part of the logging: If I remove FIRST CASE: SECOND CASE: THIRD CASE: Any clues? |
This got my HMR working. Thanks hooks: {
'vite:extend': function ({ config }) {
if (config.server && config.server.hmr && config.server.hmr !== true) {
config.server.hmr.port = 3000
}
},
},
vite: {
clearScreen: false,
envPrefix: ['VITE_', 'TAURI_'],
server: {
watch: {
ignored: ["**/src-tauri/**"],
usePolling: true
},
strictPort: true,
hmr: {
host: '192.168.0.15',
port: 5137,
protocol: "ws"
},
},
css: {
preprocessorOptions: {
scss: {
additionalData: '@use "@/assets/scss/variables.scss" as *;',
},
},
},
},
```` |
When reproducing on my Android phone, I encountered another new issue tauri-apps/wry#1420. I am attaching the Cargo lock file that works so that it can be debugged properly. Until the above issue is fixed, I can't confirm that the latest Tauri will work on my Android phone. # Cargo.toml
[package]
name = "app"
version = "0.1.0"
description = "A Tauri App"
authors = ["you"]
license = ""
repository = ""
edition = "2021"
rust-version = "1.77.2"
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
# Do not update tauri, till the issue is resolved
[lib]
name = "app_lib"
crate-type = ["staticlib", "cdylib", "lib"]
[build-dependencies]
tauri-build = { version = "2.0.0", features = [] }
[dependencies]
serde_json = "1.0"
serde = { version = "1.0", features = ["derive"] }
log = { version = "0.4" }
tauri = { version = "2.0.0", features = [] }
tauri-plugin-log = "2.0.0" // nuxt.config.ts
// ...
import process from 'node:process'
const isMobile = !!/android|ios/.exec(process.env.TAURI_ENV_PLATFORM || '')
const host = process.env.NUXT_HMR_HOST || process.env.TAURI_DEV_HOST || undefined
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
devServer: {
host: isMobile ? '0.0.0.0' : undefined,
},
ignore: [
'**/src-tauri/**',
'**/node_modules/**',
'**/dist/**',
'**/.git/**',
'**/.nuxt/**',
'**/.output/**',
],
hooks: {
// [BUG] https://github.com/tauri-apps/tauri/issues/11165
'vite:extend': host && isMobile
? ({ config }) => {
if (config.server && config.server.hmr && config.server.hmr !== true) {
config.server.hmr.protocol = 'ws'
config.server.hmr.host = host
config.server.hmr.port = 3000
}
}
: undefined,
},
vite: {
clearScreen: false,
envPrefix: ['VITE_', 'TAURI_'],
server: {
watch: {
ignored: ['**/src-tauri/**'],
usePolling: true,
},
strictPort: true,
},
css: {
preprocessorOptions: {
scss: { api: 'modern-compiler' },
},
},
},
}) I'm pretty sure that this problem can't be solved at the moment, because WebSocket doesn't seem to be able to be proxied yet. So this workaround will work for a long time yet. |
Describe the bug
The methods described in this document does not mark HMR work on mobile devices.
Because Nuxt does not use vite's HMR config. Nuxt rewrite vite config, and uses
ws://$host:$port/_nuxt/
to provide HMR:It tries to connect to
localhost:undefined
andtauri.localhost
, but this is incorrect.All endpoints have been tried and there is no WebSocket support. This may require a direct connection to the host.
Reproduction
From official document: https://v2.tauri.app/start/frontend/nuxt/
adb devices # connect a Android devices ... pnpm tauri android dev
If this is not detailed enough, please call me for reproduction.
Expected behavior
No error.
Full
tauri info
outputStack trace
Additional context
No response
The text was updated successfully, but these errors were encountered: