How to use webpack for deployment

I have a main aspnet application with the vue.js part that I create with webpack and everything works fine. Now I am looking for a solution to create a productionbuild with it, to create a mini version of my VUE package and run vue in production mode (without console.logs), which I installed in my own webpack.config, for example:

if (process.env.NODE_ENV === 'production') {
    module.exports.plugins = [
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: '"production"'
            }
        }),
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false
            }
        })
    ]
} else {
    module.exports.devtool = '#source-map'
}

but process.env.NODE_ENValways undefined when i webpack it through gulp. What I tried to use Microsoft.AspNetCore.SpaServicesthis line to startup.cs:

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
...
    if(env.IsDevelopment())
        app.UseWebpackDevMiddleware();
...
}

This works as good as my gulp configuration and is process.env.NODE_ENVset to'development'

Now I am trying to create an assembly assembly in VS 2017 (Build β†’ Publish Projectname), but the webpack task does not start.

So, I tried to add this to my * .csproj:

<Target Name="PrepublishScript" BeforeTargets="PrepareForPublish">
    <Exec Command="npm run build" />
</Target>

: "npm run build" 1.

, , - . !

+4
1

: .csproj:

<Target Name="PrepublishScript" BeforeTargets="PrepareForPublish">
    <Exec Command="npm install" />
    <Exec Command="npm run production" />
</Target>

package.json:

"scripts": {
    "dev": "cross-env NODE_ENV=development webpack --hide-modules",
    "production": "cross-env NODE_ENV=production webpack --hide-modules"
}

webpack cross-env ( -) webpack.config.js

, - webpack.config.js -

+5

Source: https://habr.com/ru/post/1673622/


All Articles