javascript - webpack menyusun hasil yang berbeza untuk fail js yang sama yang diperkenalkan dengan cara yang berbeza
Dalam projek yang dijana oleh vue-cli webpack, apabila fail jquery.mockjax.js diperkenalkan menggunakan require dalam main.js, hasil kompilasi berbeza muncul.
Bahagian kod sumber, dalam format UMD
(function(root, factory) {
'use strict';
console.log(arguments);
console.log('root', root);
// AMDJS module definition
if ( typeof define === 'function' && define.amd && define.amd.jQuery ) {
console.log('this is in amdjs module definition');
define(['jquery'], function($) {
return factory($, root);
});
// CommonJS module definition
} else if ( typeof exports === 'object' && module.exports) {
console.log('this is CommonJs module definition');
// NOTE: To use Mockjax as a Node module you MUST provide the factory with
// a valid version of jQuery and a window object (the global scope):
// var mockjax = require('jquery.mockjax')(jQuery, window);
module.exports = factory;
// Global jQuery in web browsers
} else {
console.log('this is global jquery in web browsers');
return factory(root.jQuery || root.$, root);
}
}(this, function($, window) {
'use strict';Kaedah 1:
Muat turun versi terus dari tapak web rasmi jquery.mockjax.js, kemudian letakkannya dalam folder aset projek dan sebutkan ia seperti berikut dalam main.js:
require('./assets/jquery.mockjax.js');Versi pakej terakhir pek web
eval("Object.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\n/* WEBPACK VAR INJECTION */(function(module) {/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_babel_runtime_core_js_json_stringify__ = __webpack_require__(54);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_babel_runtime_core_js_json_stringify___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_babel_runtime_core_js_json_stringify__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_babel_runtime_helpers_typeof__ = __webpack_require__(57);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_babel_runtime_helpers_typeof___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_babel_runtime_helpers_typeof__);\n\n\n(function (root, factory) {\n\t'use strict';\n\n\tconsole.log(arguments);\n\tconsole.log('root', root);\n\n\tif (typeof define === 'function' && __webpack_require__(44) && __webpack_require__(44).jQuery) {\n\t\tconsole.log('this is in amdjs module definition');\n\t\tdefine(['jquery'], function ($) {\n\t\t\treturn factory($, root);\n\t\t});\n\t} else if ((typeof exports === 'undefined' ? 'undefined' : __WEBPACK_IMPORTED_MODULE_1_babel_runtime_helpers_typeof___default()(exports)) === 'object' && module.exports) {\n\t\tconsole.log('this is CommonJs module definition');\n\n\t\tmodule.exports = factory;\n\t} else {\n\t\tconsole.log('this is global jquery in web browsers');\n\t\treturn factory(root.jQuery || root.$, root);\n\t}\n})(this, function ($, window)Kaedah 2:
Gunakan pakej npm untuk memasang jquery-mockjax, dan kemudian sebutkan ia seperti berikut dalam main.js:
require('jquery-mockjax');Versi pembungkusan akhir pek web:
eval("var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;(function(root, factory) {\n\t'use strict';\n\tconsole.log(arguments);\n\tconsole.log('root', root);\n\t// AMDJS module definition\n\tif ( \"function\" === 'function' && __webpack_require__(9) && __webpack_require__(9).jQuery ) {\n\t\t!(__WEBPACK_AMD_DEFINE_ARRAY__ = [__webpack_require__(6)], __WEBPACK_AMD_DEFINE_RESULT__ = function($) {\n\t\t\treturn factory($, root);\n\t\t}.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),\n\t\t\t\t__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));\n\n\t// CommonJS module definition\n\t} else if ( true) {\n\t\tconsole.log('in npm modules', typeof exports);\n\t\t// NOTE: To use Mockjax as a Node module you MUST provide the factory with\n\t\t// a valid version of jQuery and a window object (the global scope):\n\t\t// var mockjax = require('jquery.mockjax')(jQuery, window);\n\n\t\tmodule.exports = factory;\n\n\t// Global jQuery in web browsers\n\t} else {\n\t\treturn factory(root.jQuery || root.$, root);\n\t}\n}(this, function($, window) Soalan:
Fail js yang diimport mengikut modul dan fail js yang diperkenalkan mengikut laluan relatif ditandakan sebagai kod yang sama Webpack menyusunnya secara berbeza Pada masa ini, saya telah menyemak dokumentasi webpack dan tidak menemui maklumat yang sah. Jika sesiapa tahu apa-apa tentang webpack, sila berikan saya nasihat.
