webpack/examples/multi-compiler/README.md

245 lines
6.3 KiB
Markdown
Raw Normal View History

2014-06-12 04:52:18 +08:00
# example.js
``` javascript
if(ENV === "mobile") {
require("./mobile-stuff");
}
console.log("Running " + ENV + " build");
```
# webpack.config.js
``` javascript
var path = require("path");
var webpack = require("../../");
module.exports = [
{
2014-06-12 12:38:39 +08:00
name: "mobile",
2014-06-12 04:52:18 +08:00
entry: "./example",
output: {
path: path.join(__dirname, "js"),
filename: "mobile.js"
},
plugins: [
new webpack.DefinePlugin({
ENV: JSON.stringify("mobile")
})
]
},
{
2014-06-12 12:38:39 +08:00
name: "desktop",
2014-06-12 04:52:18 +08:00
entry: "./example",
output: {
path: path.join(__dirname, "js"),
filename: "desktop.js"
},
plugins: [
new webpack.DefinePlugin({
ENV: JSON.stringify("desktop")
})
]
}
];
```
# js/desktop.js
``` javascript
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId])
/******/ return installedModules[moduleId].exports;
/******/
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ exports: {},
/******/ id: moduleId,
/******/ loaded: false
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.loaded = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "js/";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(0);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/*!********************!*\
!*** ./example.js ***!
\********************/
/***/ function(module, exports, __webpack_require__) {
if(false) {
require("./mobile-stuff");
}
console.log("Running " + ("desktop") + " build");
/***/ }
/******/ ])
```
# js/mobile.js
``` javascript
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId])
/******/ return installedModules[moduleId].exports;
/******/
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ exports: {},
/******/ id: moduleId,
/******/ loaded: false
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.loaded = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "js/";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(0);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/*!********************!*\
!*** ./example.js ***!
\********************/
/***/ function(module, exports, __webpack_require__) {
if(true) {
__webpack_require__(/*! ./mobile-stuff */ 1);
}
console.log("Running " + ("mobile") + " build");
/***/ },
/* 1 */
/*!*************************!*\
!*** ./mobile-stuff.js ***!
\*************************/
/***/ function(module, exports, __webpack_require__) {
// mobile only stuff
/***/ }
/******/ ])
```
# Info
## Uncompressed
```
2015-01-18 07:49:58 +08:00
Hash: f7ca6364953a74846973bca985cdc67a34d859e1
Version: webpack 1.5.0
2014-06-12 12:38:39 +08:00
Child mobile:
2015-01-18 07:49:58 +08:00
Hash: f7ca6364953a74846973
Version: webpack 1.5.0
Time: 42ms
2014-06-12 04:52:18 +08:00
Asset Size Chunks Chunk Names
mobile.js 1878 0 [emitted] main
chunk {0} mobile.js (main) 117 [rendered]
> main [0] ./example.js
[0] ./example.js 97 {0} [built]
[1] ./mobile-stuff.js 20 {0} [built]
cjs require ./mobile-stuff [0] ./example.js 2:1-26
2014-06-12 12:38:39 +08:00
Child desktop:
2015-01-18 07:49:58 +08:00
Hash: bca985cdc67a34d859e1
Version: webpack 1.5.0
Time: 34ms
2014-06-12 04:52:18 +08:00
Asset Size Chunks Chunk Names
desktop.js 1673 0 [emitted] main
chunk {0} desktop.js (main) 97 [rendered]
> main [0] ./example.js
[0] ./example.js 97 {0} [built]
```
## Minimized (uglify-js, no zip)
```
2015-01-18 07:49:58 +08:00
Hash: ddb8434066401a5c4dde50e9cbb599a11735e6bb
Version: webpack 1.5.0
2014-06-12 04:52:18 +08:00
2014-06-12 12:38:39 +08:00
WARNING in (mobile) mobile.js from UglifyJs
2014-06-12 04:52:18 +08:00
Condition always true [./example.js:1,0]
2014-06-12 12:38:39 +08:00
WARNING in (desktop) desktop.js from UglifyJs
2014-06-12 04:52:18 +08:00
Condition always false [./example.js:1,0]
Dropping unreachable code [./example.js:2,0]
2014-06-12 12:38:39 +08:00
Child mobile:
2015-01-18 07:49:58 +08:00
Hash: ddb8434066401a5c4dde
Version: webpack 1.5.0
Time: 118ms
2014-06-12 04:52:18 +08:00
Asset Size Chunks Chunk Names
mobile.js 276 0 [emitted] main
chunk {0} mobile.js (main) 117 [rendered]
> main [0] ./example.js
[0] ./example.js 97 {0} [built]
[1] ./mobile-stuff.js 20 {0} [built]
cjs require ./mobile-stuff [0] ./example.js 2:1-26
WARNING in mobile.js from UglifyJs
Condition always true [./example.js:1,0]
2014-06-12 12:38:39 +08:00
Child desktop:
2015-01-18 07:49:58 +08:00
Hash: 50e9cbb599a11735e6bb
Version: webpack 1.5.0
Time: 110ms
2014-06-12 04:52:18 +08:00
Asset Size Chunks Chunk Names
desktop.js 254 0 [emitted] main
chunk {0} desktop.js (main) 97 [rendered]
> main [0] ./example.js
[0] ./example.js 97 {0} [built]
WARNING in desktop.js from UglifyJs
Condition always false [./example.js:1,0]
Dropping unreachable code [./example.js:2,0]
```