You can directly assign new properties.
(window as any).talk = () => { console.log(`Hello!`) }
You can extend the Window
interface with typings and then assign the property values.
declare global {
interface Window {
talk: () => void
concat: (words: string[]) => string
}
}
window.talk = () => { console.log(`Hello!`) }
window.concat = (words: string[]) => {
return words.join(`, `)
}
Even though Vite doesn't like chunks larger than 500 kBs after minification, you can increase the kB limit. Remember, this is just a warning, not an error.
An alternative solution is to chunk your JavaScript bundle into separate chunks, known as chunking. You can do this with the vite-plugin-chunk-split package.
Here's how to deploy your Vite app to your local network so you can access it from other devices connected to the same WiFi. Say, your iPhone or iPad.
npx vite --host {local-ip-address}
If you're on macOS, you can simply run the following.
npx vite --host $(ipconfig getifaddr en0)
A fresh Vite project will likely have a dev
key in your package.json's scripts
property mapping that Yarn or NPM command to Vite, e.g., "dev": "vite"
so you can type yarn dev
or npm run dev
and have Vite run your application in development mode.
yarn dev
# VITE v4.2.1 ready in 165 ms
#
# ➜ Local: http://localhost:5173/
# ➜ Network: use --host to expose
# ➜ press h to show help
That's the same as running npx vite
or ./node_modules/.bin/vite
.
Before we can deploy to our IP address, we need to know what it is.
You can use ipconfing
on Windows and ifconfig
on macOS.
Henry Black shared a trick to get your Mac's local IP address with ifconfig
.
ipconfig getifaddr en0
# 192.168.1.34
All you need to do is pass your IP address as Vite's --host
argument.
npx vite --host $(ipconfig getifaddr en0)
# VITE v4.2.1 ready in 166 ms
#
# ➜ Local: http://192.168.1.34:5173/
# ➜ Network: http://192.168.1.34:5173/
# ➜ press h to show help
Now I can access my Vite app from other devices in the same network, which comes in handy if you want to test your app on other computers, phones, or tablets.
Remember, npx vite
is interchangeable with yarn dev
, npm run dev
, or ./node_modules/.bin/vite`.
For more information, read Vite's Server Options.
If you found this useful, let me know at @nonoesp!