首页
前端开发
Webpack
xhr-eval-chunk-webpack-plugin Webpack块XHR加载插件

xhr-eval-chunk-webpack-plugin Webpack块XHR加载插件

0 次浏览 0 条评论
zip
zip

XHR 加载的 Webpack 块，替代默认的script标签方式，xhr-eval-chunk-webpack-plugin干的就是这件事。它会拦截 Webpack 打包后的require.ensure逻辑，改用 XHR 去拉代码，再通过eval执行，嗯，听着有点“黑科技”，但真挺实用的。

是你在做React 服务端渲染的时候，这插件就比较香了。它能帮你避免那种客户端还没反应过来，Webpack 就自己往<head>里插一堆script的尴尬。最终效果是——客户端和服务端的标记能对得上，不会抖、不闪、协调地顺滑。

使用也不难，装个包：npm install xhr-eval-chunk-webpack-plugin，在你的webpack.config.js里加上：

import XhrEvalChunkPlugin from 'xhr-eval-chunk-webpack-plugin';


export default {
  // ...其他配置
  plugins: [
    new XhrEvalChunkPlugin()
  ]
};

嗯，插件本身挺轻量的，不会给打包带什么额外负担。如果你项目里有 React SSR 场景，或者不想在<head>里塞一堆script，可以试试这个方案。

想深入了解服务端渲染的朋友，可以看看这些文章：

如果你项目偏向 SSR，又想让 Webpack 加载块时更“隐蔽”些，可以大胆试试这个插件，效果还蛮不错的。

zip 文件大小：55.87KB