Skip to content
This repository was archived by the owner on Mar 22, 2019. It is now read-only.

api in modules.cn

Jump to bottom
e-cloud edited this page Mar 14, 2016 · 1 revision

A quick summary of all methods and variables available in code compiled with webpack. 简要总结所有可用在经webpack编译的代码中的方法与变量

Basic 基本

require CommonJs

require(dependency: String)

Returns the exports from a dependency. The call is sync. No request to the server is fired. The compiler ensures that the dependency is available.

返回对应依赖的输出。调用是同步的。不会触发任何服务器请求。webpack编译器确保依赖关系是可用的。

Style: CommonJS

Example:

var $ = require("jquery");
var myModule = require("my-module");

define (with factory)

define([name: String], [dependencies: String[]], factoryMethod: function(...))

The name argument is ignored. If the dependencies array is provided, the factoryMethod will be called with the exports of each dependency (in the same order). If dependencies is not provided the factoryMethod is called with require, exports and module (for compatibility!). If the factoryMethod returns a value, this value is exported by the module. The call is sync. No request to the server is fired. The compiler ensures that each dependency is available.

模块名参数被忽略了。如果声明了dependencies数组，对应依赖的输出将被注入到factoryMethod作为参数（顺序保持一致）。如果没提供dependencies，factoryMethod调用时会被注入参数——require, exports 和 module(兼容性！)。调用是同步的。不会触发任何服务器请求。webpack编译器确保依赖关系是可用的。

Style: AMD

Example:

define(["jquery", "my-module"], function($, myModule) {
	// Do something with $ and myModule.
	// Export a function
	return function doSomething() {
		// Do something
	};
});

Note: Can NOT be used in an async function.

注：不能在异步函数中使用。

module.exports

This value is returned, when that module is required. It's default value is a new object.

该模块被依赖时，此输出值会被返回。其默认值是一个新的对象。

Style: CommonJS

Example:

module.exports = function doSomething() {
	// Do something
};

Note: Can NOT be used in an async function.

注：不能在异步函数中使用。

exports

The exported object. It's the default value of module.exports. If module.exports gets overwritten, exports will no longer be exported.

指向被输出的对象。它是module.exports的默认值。如果module.exports被覆盖，exports将不再被输出。

Style: CommonJS

exports.someValue = 42;
exports.anObject = {
	x: 123
};
exports.aFunction = function doSomething() {
	// Do something
};

Note: Using it in an async function may not have the expected effect.

注：在异步函数使用它可能没有预期的效果。

define (with value)

define(value: !Function)

Just exports the provided value. The value cannot be a function.

只输出_传入_的value。value不能是一个函数。

Style: AMD（兼容性！）

Example:

define({
	answer: 42
});

Note: Can NOT be used in an async function.

注：不能在异步函数中使用。

export (label)

export: value

Export the defined value. The label can occur before a function declaration or a variable declaration. The function name or variable name is the identifier under which the value is exported.

输出已定义值。该标签可以出现在函数的声明或者变量声明之前。 函数名或变量名是对应被输出/导出值的标识符（译者注：就是变成输出对象的属性名）。

Style: 标记模块 dependencies.LabeledModulesPlugin

Example:

export: var answer = 42;
export: function method(value) {
  // Do something
};

Note: Using it in an async function may not have the expected effect.

注意：在异步函数使用它可能没有预期的效果。

require label

require: "dependency"

Make all exports from the dependency available in the current scope. The require label can occur before a string. The dependency must export values with the export label. CommonJs or AMD modules cannot be consumed.

将对应依赖输出的所有属性注入到当前作用域。[此处难以翻译]The require label can occur before a string. 对应依赖必须使用exports标签输出值。对CommonJS或AMD模块无效。

Style: 标记模块 dependencies.LabeledModulesPlugin

Example:

// in dependency
export: var answer = 42;
export: function method(value) {
	// Do something
};
require: "dependency";
method(answer);

require.resolve

require.resolve(dependency: String)

Returns the module id of a dependency. The call is sync. No request to the server is fired. The compiler ensures that the dependency is available.

The module id is a number in webpack (in contrast to node.js where it is a string, the filename).

返回依赖的模块ID。调用是同步的。不会触发任何服务器请求。webpack编译器确保依赖关系是可用的。

在webpack中，模块ID是一个数字（在Node.js中则不同，文件名是一个字符串）

Style: CommonJS

Example:

var id = require.resolve("dependency");
typeof id === "number";
id === 0 // if dependency is the entry point
id > 0 // elsewise

module.id

The module id of the current module.

当前模块的模块ID。

Style: CommonJs

Example:

// in file.js
module.id === require.resolve("./file.js")

Advanced 进阶

require.cache

Multiple requires to the same module result in only one module execution and only one export. Therefore a cache in the runtime exists. Removing values from this cache cause new module execution and a new export. This is only needed in rare cases (for compatibility!).

对同一模块的多次require只会触发一次该模块的执行与输出。因此，运行时是存在着缓存的。删除缓存中的值会引起对应模块的重新执行与新的输出。这只在极少数情况下需要（兼容性！）。

Style: CommonJs

var d1 = require("dependency");
require("dependency") === d1
delete require.cache[require.resolve("dependency")];
require("dependency") !== d1
// in file.js
require.cache[module.id] === module
require("./file.js") === module.exports
delete require.cache[module.id];
require.cache[module.id] === undefined
require("./file.js") !== module.exports // in theory; in praxis this causes a stack overflow
require.cache[module.id] !== module

require.context

require.context(directory:String, includeSubdirs:Boolean /* optional, default true */, filter:RegExp /* optional */)

[此处缺说明，原文也没有]

Example:

var context = require.context('components', true, /\.html$/);

var componentA = context.resolve('componentA');

Style: webpack

require.ensure

require.ensure(dependencies: String[], callback: function([require]), [chunkName: String])

Download additional dependencies on demand. The dependencies array lists modules that should be available. When they are, callback is called. If the callback is a function expression, dependencies in that source part are extracted and also loaded on demand. A single request is fired to the server, except if all modules are already available.

This creates a chunk. The chunk can be named. If a chunk with this name already exists, the dependencies are merged into that chunk and that chunk is used.

按需下载额外的依赖。dependencies数组列举理应可用的模块。当其可用时，callback会被调用。如果callback是一个函数表达式，其源码内的依赖会被解析并按需加载。除非所有模块都可用（已被加载），否则webpack会触发一个请求到服务器。

这会创建一个打包块chunk（译者注：此翻译乃自创术语）。该打包块可以被命名。如果用这个命名的打包块已经存在，依赖会被合并至该打包块而该打包块会被启用。

Style: CommonJS

Example:

// in file.js
var a = require("a");
require.ensure(["b"], function(require) {
	var c = require("c");
});
require.ensure(["d"], function() {
	var e = require("e");
}, "my chunk");
require.ensure([], function() {
	var f = require("f");
}, "my chunk");
/* This results in:
	* entry chunk
		- file.js
		- a
	* anonymous chunk
		- b
		- c
	* "my chunk"
		- d
		- e
		- f
*/

require AMD

require(dependencies: String[], [callback: function(...)])

Behaves similar to require.ensure, but the callback is called with the exports of each dependency in the dependencies array. There is no option to provide a chunk name.

行为类似于require.ensure，但回调被调用时，会被注入对应依赖的输出。不提供指定打包块的名称。

Style: AMD

Example:

// in file.js
var a = require("a");
require(["b"], function(b) {
  var c = require("c");
});
/* This results in:
	* entry chunk
		- file.js
		- a
	* anonymous chunk
		- b
		- c
*/

require.include

require.include(dependency: String)

Ensures that the dependency is available, but don't execute it. This can be use for optimizing the position of a module in the chunks.

确保依赖是可用的，但不执行它。这可以用于优化打包块中模块的位置。

Style: webpack

Example:

// in file.js
require.include("a");
require.ensure(["a", "b"], function(require) {
  // Do something
});
require.ensure(["a", "c"], function(require) {
  // Do something
});
/* This results in:
   * entry chunk
	 - file.js
	 - a
   * anonymous chunk
	 - b
   * anonymous chunk
	 - c
Without require.include "a" would be in both anonymous chunks.
The runtime behavior isn't changed.
*/

module.loaded

This is false if the module is currently executing, and false if the sync execution has finished.

如果模块正在执行，此变量值会是false。如果模块的同步执行已结束，值同样是false（译者注：这里好像不太对）

Style: node.js (兼容性！)

module.hot

See Hot Module Replacement. 参见Hot Module Replacement （模块热替换）。

Style: webpack

global

参见 node.js global

Style: node.js

process

参见 node.js process

Style: node.js

__dirname

Depending on the config option node.__dirname: 依赖于配置选项 node.__ dirname:

If used inside a expression that is parsed by the Parser, the config option is threaded as true.

如果在解析器解析的表达式中被使用，该配置选项将被视为true。

Style: node.js (兼容性！)

__filename

依赖于配置选项 node.__filename:

如果在解析器解析的表达式中被使用，该配置选项将被视为true。

Style: node.js (兼容性！)

__resourceQuery

The resource query of the current module.

当前模块的资源查询。

Style: webpack

Example:

// Inside "file.js?test":
__resourceQuery === "?test"

__webpack_public_path__

Equals the config options output.publicPath. 等于配置选项output.publicPath。

Style: webpack

__webpack_require__

The raw require function. This expression isn't parsed by the Parser for dependencies.

webpack原生的require函数。此类表达式不会被解析器触发依赖解析。

Style: webpack

__webpack_chunk_load__

The internal chunk loading function. Takes two arguments: 内部打包块的加载函数，带两个参数：

  • chunkId 需加载的打包块的ID
  • callback(require) 一旦打包块被加载完毕后被回调的函数

Style: webpack

__webpack_modules__

Access to the internal object of all modules. 可用于访问所有模块的内部对象。

Style: webpack

require.resolveWeak

Like require.resolve, but doesn't include the module into the bundle. It's a weak dependency.

像require.resolve，但不会将对应模块包含进bundle(打包产出物)(注：又见自创术语)。这是一项弱依赖。

Style: webpack

Example:

if(__webpack_modules__[require.resolveWeak("module")]) {
  // do something when module is available
}
if(require.cache[require.resolveWeak("module")]) {
  // do something when module was loaded before
}

__webpack_hash__

Access to the hash of the compilation.

Only available with the HotModuleReplacementPlugin or the ExtendedAPIPlugin

指向编译的哈希值。

仅可用于HotModuleReplacementPlugin或ExtendedAPIPlugin

Style: webpack

__non_webpack_require__

Generates a require function that is not parsed by webpack. Can be used to do cool stuff with a global require function if available.

标记生成一个不被webpack解析的require函数。如果全局有个require函数可用的话，可用来做些很cool的事情。

Style: webpack

DEBUG

Equals the config option debug

等于配置选项'debug`

Style: webpack

Clone this wiki locally