How to disable minify in build ?

[issam-seghir]

I can't seem to figure out how can i disable minify in build (vite build)
i want to watch changes when convert sass file to css file

this is my config file :

import { defineConfig } from "vite";

export default defineConfig(({ command, mode, ssrBuild }) => ({
	build: {
		cssMinify: false, // Deactivate esbuild and use cssnano for CSS only
		minify: false,
		// Other build options go here
	},
}));

[tetron432]

Did you figure it out?

[tetron432]

I already have that in my vite.config.js files, but I deploy the project in production, Vite appears to change the JavaScript file name and structure still.

[issam-seghir]

What is your goal? Initially, I tried to not minify my files in production mode. However, I later discovered that this approach did not benefit me. In development mode, I can easily perform any necessary actions. If you need to watch sass file, you can use the sass command. Additionally, if you want to avoid hashing file names, you can add the necessary configuration to your settings.

	// Getting rid of hashes in generated filenames
	filenameHashing: false,
	build: {
		// change output location
		rollupOptions: {
			output: {
				manualChunks: undefined,
				assetFileNames: "assets/[name].[ext]", // Output assets (e.g., images, SVGs) to the assets folder
				entryFileNames: "assets/[name].js", // Output entry files (e.g., JavaScript) to the root directory
				chunkFileNames: "assets/[name].[ext]", // Output dynamic imports (chunks) to the assets folder
			},
		},
	},

[meetstack19]

build: {
minify: false,
},

does not work for me. I want to track the minified error is coming from which file when I use my production build file on production environment.

[AlekseyKopasov]

I encountered a similar problem. What helped me was deleting the rule for cssnano in my .postcssrc.js

export default (ctx) => ({
  parser: ctx.parser ? 'sugarss' : false,
  map: ctx.env === 'development' ? ctx.map : false,
  plugins: {
    'autoprefixer': {},
     ...other rules
    **// 'cssnano': ctx.env === 'production' ? {} : false**
  },
});

[azulkipli]

thanks @AlekseyKopasov it works for me too

postcss.config.mjs

export default {
  plugins: {
    'postcss-import': {},
    'tailwindcss/nesting': {},
    tailwindcss: {},
    autoprefixer: {},
    // ...(process.env.NODE_ENV === 'production' ? { cssnano: {} } : {})
  },
}

[abdulkarim-itani]

The properties you're using (cssMinify and minify) are not correct for this purpose. To disable minification, you should set the minify property to false correctly, and terserOptions should be used for additional configurations.

Here's an updated version of your vite.config

import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
  base: "./",
  plugins: [react()],
  build: {
    minify: false,
    terserOptions: {
      compress: false,
      mangle: false,
    },
  },
})

In this configuration:

• minify: false disables the minification process.
• terserOptions: { compress: false, mangle: false } ensures that Terser (the minifier used by Vite) does not compress or mangle the code.

[aloayzab88]

Hi, is there any way to disable minification of the html using pug?