CODEWITHSUNDEEP
node.jswebpackvue.jsvuejs2webpack-2
A. L
A. L

Reputation: 12649

how to uglify a file and save to another location (vue.js)

I am unsure on how to uglify my server.js file and save it into the dist folder under a server folder. Right now I'm just using the CopyWebpackPlugin

new CopyWebpackPlugin([
  {
    from: path.resolve(__dirname, '../static'),
    to: config.build.assetsSubDirectory,
    ignore: ['.*']
  },
  {
    from: path.resolve(__dirname, '../src/server'),
    to: config.build.assetsServerDirectory,
    ignore: ['*.sql']
  }
]),

This works, but is just a simple copy and paste.

Upvotes: 5

Views: 2375

Answers (2)

acdcjunior
acdcjunior

Reputation: 135772

You can use uglify-es + copy-webpack-plugin's transform():

  • Install the package:

    npm install uglify-es --save-dev

  • Add it to your source:

    const UglifyJS = require("uglify-es");                  // add the require

new CopyWebpackPlugin([
  {
    from: path.resolve(__dirname, '../static'),
    to: config.build.assetsSubDirectory,
    ignore: ['.*']
  },
  {
    from: path.resolve(__dirname, '../src/server'),
    to: config.build.assetsServerDirectory,
    transform: function (content, path) {               // add transform()
      return UglifyJS.minify(content.toString()).code;  // use uglify
    },                                                  // (no args = mangle+compress)
    ignore: ['*.sql']
  }
]),

Note: UglifyJS.minify(content.toString()).code is the same as UglifyJS.minify(content.toString('utf8')).code. There are options in case of different encodings.

Upvotes: 8

bumblebeen
bumblebeen

Reputation: 692

There is a library already ready for that. You can use uglifyjs-webpack-plugin

Then output the bundled file to your desired directory

If you don't like using the plugin. You can use Webpack's default uglifier.

const webpack = require("webpack");

    module.exports = {
      entry: {
        "bundle": "./server/server.js",
      }
      output: {
        path: "./dist",
        filename: "[name].js"
      },
      plugins: [
        new webpack.optimize.UglifyJsPlugin({
          include: /\.js$/,
          minimize: true
        })
      ]
    };

Upvotes: 0

Related Questions