-
-
Notifications
You must be signed in to change notification settings - Fork 6.1k
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
Vite Preview Watch Mode #5196
Comments
How we're doing it, essentially: Though I agree it would be nice to have a built-in so we could chain args onto that, and avoid |
I think there should be a live reload also |
We have discussed this yesterday and are open to implement |
we need a live reload also |
Of course, I think it was implied that |
I also want this. I think for me it would be a valid alternative to having tree shaking for the dev server (see also #8237). In fact, I already turn off HMR (which I generally am not a fan of) in favor of full page reloads (plugin). |
I'm about to turn HMR off too. It doesn't keep full state of a component (props, provides, parent DOM event listeners and so on). It's ok for CSS styles though. |
This is what is blocking me from migrating from Parcel. |
I think |
One potentially suitable alternative that I found for now: If it helps anyone else, here's what I'm doing:
I figured port |
That is my workaround using {
"scripts": {
"preview:watch": "concurrently \"vite preview -l silent\" \"vite build --watch\"",
}
} |
Vite has JavaScript API, so it is possible to run both build --watch and preview as a single command: dev.js import { build, preview } from 'vite';
let previewServer;
build({ build: { watch: {} } }).then((buildWatcher) => {
buildWatcher.on('event', async ({ code }) => {
if (code === 'END') {
previewServer = previewServer || (await preview());
console.log('\n');
previewServer.printUrls();
}
});
}); package.json {
"scripts": {
"dev": "node dev"
}
} |
@acupofspirt - This is a great suggestion. How can this be configured to pass in a |
@ccaspanello Smth like this import minimist from 'minimist';
import { build, preview } from 'vite';
const { port } = minimist(process.argv.slice(2))
let previewServer;
build({ build: { watch: {} } }).then((buildWatcher) => {
buildWatcher.on('event', async ({ code }) => {
if (code === 'END') {
previewServer = previewServer || (await preview({preview: { port }}));
console.log('\n');
previewServer.printUrls();
}
});
}); and {
"scripts": {
"dev": "node dev --port 5555"
}
} |
Is there any update on this? It would be really useful to have the |
While I still think it would be useful to add So, I took the Vite API solution @acupofspirt posted, added auto page reloading, and turned it into a separate tool as a stand-in for the (hopefully) future
Hope this helps some of you. Feel free to post issues on the repo or contribute. |
I do get this output about the page reloading but the page doesn't reload & has to be reloaded manually `9:31:16 PM [vite] page-reload 9:31:16 PM [vite] preview server ready` |
There was a bug. Try updating to the latest version (0.1.8). |
@Shakeskeyboarde I used (0.1.8) only, I again cross-checked by re-installing. The build is successful & the output is in the console |
Okay. Could you report a bug on the repo please? Include the browser, os, package manager, and a minimal repro if you can. |
Fixed it for me
|
Clear and concise description of the problem
When using vite without a index.html file for strictly a "library" or other script where /dis/.... is the only asset in interest, the only way we can currently run this locally is with vite build --watch paired with http-server for instance.
Is there any way to get a local http server for the static /dist assets with a watcher?
Suggested solution
vite preview --watch
Alternative
No response
Additional context
No response
Validations
The text was updated successfully, but these errors were encountered: