Webpack loader: inline or embed the required, omit a final jsonp functions -
let's suppose next files:
a.html
<span>a</span>
b.js
module.exports = function(){};
wrap.js
module.exports = { html: require('./a.html'), // inlined class: require('wrap-class'), // not exists func: require('./b'), };
main.js
require('./wrap');
let's suppose next loader:
wrap-loader.js
module.exports = function (source){ // loaded contents // specific childs or dynamically loaded // require('./a.html') -> inlined or embedded // require('class-exists') -> resolve depending on // source code `source` , contents of html (`a.html`) return source; // modify source }
and finally, have when requiring main.js
bundle:
jsonp(...,[ /* 0 */ /* ./main.js */ function(module, exports, __webpack_require__){ __webpack_require__(/*! ./wrap.js */ 1); }, /* 1 */ /* ./wrap.js */ function(module, exports, __webpack_require__){ module.exports = { html: '<span>a</span>', class: 'cls-wrap cls-based-on-a-html-and-wrap-js', func: __webpack_require_(/*! ./b.js */ 2), } }, /* 2 */ /* ./b.js */ function(module, exports, __webpack_require__){ module.exports = function(){}; } ]);
question
how can achieve:
- that specific
require
inside currentsource
inwrap-loader.js
inlined or embedded insource
itself, without generating new function (let's say, because won't reused other, , in case, inline again). in above example:a.html
. - that
source
inwrap-loader.js
resolves dynamically module based on other data (eg.source
itself, , contents ofa.html
) , inserts them insource
(whererequire('wrap-class')
).
trials
this.resolvesync
, this.resolve
don't same contents require('something')
in code (eg. yaml-loader, html-loader loaded javascript, @ least emit errors).
Comments
Post a Comment