Replies: 13 comments 24 replies
-
|
I have the same question. |
Beta Was this translation helpful? Give feedback.
-
|
Sooooo need this too :D |
Beta Was this translation helpful? Give feedback.
-
|
ETA: Correction to below — this totally does not work on Using build: {
rollupOptions: {
external: new Regexp('/gallery/.*')
}, // ...etc.
}Using a function, e.g. That said, I'm building in Library Mode, so YMMV. |
Beta Was this translation helpful? Give feedback.
-
|
OK, I haven't found a way to exclude a // In vite.config.js
function stripDevCSS () {
return {
name: 'strip-dev-css',
resolveId (source) {
return source === 'virtual-module' ? source : null
},
renderStart (outputOptions, inputOptions) {
const outDir = outputOptions.dir
const cssDir = path.resolve(outDir, 'css')
fs.rmdir(cssDir, { recursive: true }, () => console.log(`Deleted ${cssDir}`))
}
}
}
export default defineConfig({
// ... rest of config
plugins: [vue(), stripDevCSS()]
})With a little work one could easily make this more general. |
Beta Was this translation helpful? Give feedback.
-
|
just as dmolesUC say,it is ok |
Beta Was this translation helpful? Give feedback.
-
|
thanks, it works well |
Beta Was this translation helpful? Give feedback.
-
|
My solution is to simply not copy some directories into Docker image — in a case your code is built by Docker container. FROM node:18.0.0-alpine AS build
WORKDIR /app
COPY package*.json ./
RUN npm i
COPY vite.config.js index.html ./
COPY src/ src/
# Copy only those subfolders you need
# (or you can copy entire directory but use .dockerignore as well)
COPY public/subfolder/ public/subfolder/
RUN npx vite build
FROM caddy:2.5.0
COPY Caddyfile /etc/caddy/
COPY --from=build /app/dist/ /app/ |
Beta Was this translation helpful? Give feedback.
-
|
I read source code of vite,find that there is no config could resolve this problem;
|
Beta Was this translation helpful? Give feedback.
-
|
@gbirke You can config export default defineConfig({
publicDir: false,
// ....
} |
Beta Was this translation helpful? Give feedback.
-
|
We need publicDir functionality, we just want to exclude some subfiles / subfolders, not the entire directory. |
Beta Was this translation helpful? Give feedback.
-
|
Ok, here we go. I've managed to work around it by adding a middleware that serves static assets from a specific directory - and if the file doesn't exist then the request carries on to the vite server:
vite.config.js plugins/general_assets.js Now make sure in the root of your project you have a 'public' directory (or whatever you want to name it, it'll probably not be I think it's good practice to have a further namespace (like Hope this helps someone :) |
Beta Was this translation helpful? Give feedback.
-
https://vite.dev/guide/cli#vite-preview |
Beta Was this translation helpful? Give feedback.
-
Interesting! :) I've never used that mode before, just |
Beta Was this translation helpful? Give feedback.
-
Mh, there is no preview build process. You first vite build and then vite preview. The preview is 100% production build. I like that. But I feel vite is missing webpack-dev-servers static assets serve and watch options. https://webpack.js.org/configuration/dev-server/#devserverstatic |
Beta Was this translation helpful? Give feedback.
-
I see, so there's no flag or anything you can detect in the production build process that would tell you it's just a preview build? That's a bummer. |
Beta Was this translation helpful? Give feedback.
-
Well, there is a flag. |
Beta Was this translation helpful? Give feedback.
-
|
@dmolesUC thanks for sharing your code. I ran it against Vite 4.2 and it was running a bit too early. In case anyone else comes across this thread, using a different hook (writeBundle) solved the issue for me. function stripDevCSS () {
return {
name: 'strip-dev-css',
resolveId (source) {
return source === 'virtual-module' ? source : null
},
writeBundle (outputOptions, inputOptions) {
const outDir = outputOptions.dir;
const cssDir = path.resolve(outDir, 'css');
fs.rm(cssDir, { recursive: true }, () => console.log(`Deleted ${cssDir}`))
}
}
}
export default defineConfig({
// ... rest of config
plugins: [vue(), stripDevCSS()]
}) |
Beta Was this translation helpful? Give feedback.
-
|
In case anyone finds it useful, I ended up just making the // vite.config.ts
export default defineConfig(({ command }) => ({
plugins: [react()],
resolve: {
alias: {
src: path.resolve("./src"),
},
},
publicDir: command === "serve" ? "public" : false,
}));This allows the dev server to serve vite build && rsync -av public/ dist --exclude dir-to-exclude --exclude another-dir-to-exclude |
Beta Was this translation helpful? Give feedback.
-
|
Thanks! This saved me 20 minutes for each deployment because I didn't have to copy static image files! |
Beta Was this translation helpful? Give feedback.
-
|
Beautiful stuff! Thanks! |
Beta Was this translation helpful? Give feedback.
-
|
The easiest way to solve this for me was a combination of the export default defineConfig(({ command }) => ({
publicDir: command === 'build' ? false : 'public',
/* ... the rest of the config */
})); |
Beta Was this translation helpful? Give feedback.
-
|
Thanks, just exactly what I needed. |
Beta Was this translation helpful? Give feedback.
-
|
Should an issue be created for this, since this is just a discussion? |
Beta Was this translation helpful? Give feedback.
-
|
A quick and dirty solution is to modify the build script inside {
"scripts": {
"build": "tsc && vite build && rm -r dist/gallery/"
}
} |
Beta Was this translation helpful? Give feedback.
-
|
@PythonCircuit I find the solution to be pretty straightforward for the OP. What is your specific situation? Another solution could be a custom plugin: import { defineConfig } from 'vite'
import fs from 'node:fs/promises'
export default defineConfig({
plugins: [
{
name: 'delete-gallery',
async writeBundle() {
await fs.rm('dist/gallery', { recursive: true })
},
},
],
})There you can add your custom logic that you can't cover via the CLI. |
Beta Was this translation helpful? Give feedback.
-
Unfortunately there is no way to re-include the files for |
Beta Was this translation helpful? Give feedback.
-
|
I see, so you need that directory to exist in the filesystem. Depending on how you're deploying, can't you delete that directory in your deployment step? I'm short on details on what your needs are, maybe there's a way to satisfy them in a different way if what I proposed doesn't work for you. Feel free to open a question in the Vite Discord, elaborate your situation and give me a mention (@silvenon). Feels like people are piling on this question with somewhat different needs. |
Beta Was this translation helpful? Give feedback.
-
That is true. We can do that in our deployment stage and remove the files before creating the docker image. I think that could be the way to go for us. Yet, it feels a bit janky... |
Beta Was this translation helpful? Give feedback.
-
|
Well, the requirement itself is very specific, so it requires a specific solution, but If you want to keep everything enclosed in your {
name: 'delete-gallery',
apply() {
return process.env.CI
},
async writeBundle() {
await fs.rm('dist/gallery', { recursive: true })
},
}Now this plugin will work only on CI build. |
Beta Was this translation helpful? Give feedback.
-
|
I'm not sure, but I wrote a library that supports multiple shared folders. You can see the library here, and the documentation here. Does it help you? In case you want to skip some files when copying my library supports So files ending in |
Beta Was this translation helpful? Give feedback.
and others
-
I'm writing an image viewer application, where the images are static assets in the
public/gallerydirectory. The content of this directory is provided externally and the bundler should not care what's in there. How can I make sure that the build step does not copy all the images in thepublic/gallerydirectory?Beta Was this translation helpful? Give feedback.
All reactions