Webpack-targets (Build target)

Build Target (Targets)

Because both the server and browser code can be written in JavaScript, Webpack provides a variety of build targetsthat you can set in your webpack configuration.

Webpack target properties are not output.libraryTarget confused with attributes. For output more information about properties, see our guide.

usage

To set a target property, you only need to set the target value in your webpack configuration.

Webpack.config.js

Module.exports = {  'node'};

In the example above, the use node of Webpack will be compiled for the class node.js"environment (using node. js require instead of using any built-in modules (such as fs or path ) to load chunk).

Each target has a variety of deployment (deployment)/environment (environment) specific add-ons to support its needs. View the available values for target.

further expansion for other popular target values

multiple Target

Although Webpack does not support the target passing of multiple strings, you can create a homogeneous library by packaging two separate configurations:

Webpack.config.jsvarPath = require ('Path‘);varServerconfig ={target:‘node‘, Output: {path:path.resolve (__dirname,‘Dist‘), FileName:‘Lib.node.js‘  }  //... ..};varClientConfig ={target:‘Web‘,//<=== default is ' Web ', can omitoutput: {path:path.resolve (__dirname,‘Dist‘), FileName:‘Lib.js‘  }  //... ..};module.exports= [Serverconfig, ClientConfig];

The above example will be dist created under your folder lib.js and the lib.node.js file.

Resources

From the options above, you can see that there are several different deployment targets to choose from. Here is a list of examples and resources you can refer to.

• Compare-webpack-target-bundles: A large number of resources for "testing and viewing" different Webpack target . There are also a number of bug reports.
• Boilerplate of electron-react application: A good example of the process of building a Electron main process and rendering process.

Webpack-targets (Build target)