Visual Studio 2017 minify on save

Question

Can anyone explain how to minify files on save. The extension Web Essentials used to work perfectly in earlier versions of VS and used to make life easy. Now it just won't work.

I have tried uninstalling and reinstalling the extension but it doesn't work. Right-clicking on the CSS file in the solution gives the option to Re-Bundle file that doesn't work. I have tried building the application after making changes and that doesn't work.

Any tips or things to try would be appreciated. I know I can copy the text and minify with other tools but that makes things take longer than they really should.

score 5 · Accepted Answer · edited Mar 23 '18 at 03:18

5

I have found that if the minifier is not working it is because there is an error in my CSS file that is not acceptable to VS.

It is hard to notice because the error only shows in the error list and there is no obvious alert for it like other code errors. I suggest looking to see if there is a CSS error in the error list and then correcting it.

edited Mar 23 '18 at 03:18

Nisarg Shah

14,151
6
34
55

answered Mar 23 '18 at 02:40

Tyson Gibby

2,590
2
18
37

score 0 · Answer 2 · answered Nov 11 '19 at 06:22

Bundler and minifier uses the old non maintained NUglify minifier, which doesn't support modern syntax constructs of both CSS and JavaScript.

Use NodeJS based tools instead and add them as a build step in your .csproj file. For example, I have this task in my project file:

<Target Name="Compile Typescript" BeforeTargets="Build">
    <Exec Command="npm run build" />
</Target>

And in my package.json file, I have:

{
"name": "NAME",
"version": "1.0.0",
"description": "DESCRIPTION",
"scripts": {
    "build": "babel Scripts -d wwwroot/scripts --extensions .ts",
    "watch": "babel Scripts -d wwwroot/scripts --extensions .ts -w"
},
"author": "AUTHOR",
"license": "ISC",
"devDependencies": {
    "@babel/cli": "^7.7.0",
    "@babel/core": "^7.7.2",
    "@babel/preset-env": "^7.7.1",
    "@babel/preset-typescript": "^7.7.2"
}
}

Which uses Babel to compile and minify Typescript files.

Visual Studio 2017 minify on save

2 Answers2