构建动态组件源码

__webpack_require__.e webpack\lib\runtime\EnsureChunkRuntimeModule.js

    /**
     * @returns {string} runtime code
     */
    generate() {
        const { runtimeTemplate } = this.compilation;
        // Check if there are non initial chunks which need to be imported using require-ensure
        if (this.runtimeRequirements.has(RuntimeGlobals.ensureChunkHandlers)) {
            const handlers = RuntimeGlobals.ensureChunkHandlers;
            console.log('编译的时候:generate====>')
            return Template.asString([
                `${handlers} = {};`,
                "// This file contains only the entry chunk.",
                "// The chunk loading function for additional chunks",
                `${RuntimeGlobals.ensureChunk} = ${runtimeTemplate.basicFunction(
                    "chunkId",
                    [
                        `return Promise.all(Object.keys(${handlers}).reduce(${runtimeTemplate.basicFunction(
                            "promises, key",
                            [`${handlers}[key](chunkId, promises);`, "return promises;"]
                        )}, []));`
                    ]
                )};`
            ]);
        } else {
            // There ensureChunk is used somewhere in the tree, so we need an empty requireEnsure
            // function. This can happen with multiple entrypoints.
            return Template.asString([
                "// The chunk loading function for additional chunks",
                "// Since all referenced chunks are already included",
                "// in this file, this function is empty here.",
                `${RuntimeGlobals.ensureChunk} = ${runtimeTemplate.returningFunction(
                    "Promise.resolve()"
                )};`
            ]);
        }
    }

编译的时候构建jsonp,webpack\lib\runtime\LoadScriptRuntimeModule.js

log打印code:

编译的时候构建jsonp请求: script = document.createElement('script');

script.charset = 'utf-8';
script.timeout = 120;
if (__webpack_require__.nc) {
        script.setAttribute("nonce", __webpack_require__.nc);
}
script.setAttribute("data-webpack", dataWebpackPrefix + key);
script.src = url;

构建中的源码：

    generate() {
        const { compilation } = this;
        const { runtimeTemplate, outputOptions } = compilation;
        const {
            scriptType,
            chunkLoadTimeout: loadTimeout,
            crossOriginLoading,
            uniqueName,
            charset
        } = outputOptions;
        const fn = RuntimeGlobals.loadScript;

        const { createScript } =
            LoadScriptRuntimeModule.getCompilationHooks(compilation);

        const code = Template.asString([
            "script = document.createElement('script');",
            scriptType ? `script.type = ${JSON.stringify(scriptType)};` : "",
            charset ? "script.charset = 'utf-8';" : "",
            `script.timeout = ${loadTimeout / 1000};`,
            `if (${RuntimeGlobals.scriptNonce}) {`,
            Template.indent(
                `script.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`
            ),
            "}",
            uniqueName
                ? 'script.setAttribute("data-webpack", dataWebpackPrefix + key);'
                : "",
            `script.src = ${this._withCreateScriptUrl
                ? `${RuntimeGlobals.createScriptUrl}(url)`
                : "url"
            };`,
            crossOriginLoading
                ? crossOriginLoading === "use-credentials"
                    ? 'script.crossOrigin = "use-credentials";'
                    : Template.asString([
                        "if (script.src.indexOf(window.location.origin + '/') !== 0) {",
                        Template.indent(
                            `script.crossOrigin = ${JSON.stringify(crossOriginLoading)};`
                        ),
                        "}"
                    ])
                : ""
        ]);
        console.log('编译的时候构建jsonp请求:', code)
    // ...