webpack手写loader ---- style-loader

let loaderUtils = require("loader-utils");
//style-loader是接收less-loader过来的内容进行解析
function loader(source) {
    //组装成style格式的css
    let style = (`
        let style = document.createElement("style");
        style.innerHTML = ${JSON.stringify(source)};
        document.head.appendChild(style);
    `);
    return style;
}

//request是文件的请求路径,创建style标签,动态添加到head
loader.pitch = function (request) {
    let style = `
        var style = document.createElement("style");
        style.innerHTML = require(${loaderUtils.stringifyRequest(this, "!!" + request)});
        document.head.appendChild(style);
    `;
    return style;
};

module.exports = loader;
发布了80 篇原创文章 · 获赞 5 · 访问量 4万+

猜你喜欢

转载自blog.csdn.net/qq_28473733/article/details/95486417