栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

如何在不缩小的情况下构建React的生产版本?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

如何在不缩小的情况下构建React的生产版本?

要更改webpack配置和构建脚本,您必须从create-react-app中退出(我不建议您执行此步骤,因为这会破坏将来的兼容性),或者您可以使用诸如rewire之类的工具来覆盖某些设置

看看这个 https://github.com/timarney/react-app-rewired

我个人只是重新接线

npm i rewire --save-dev

这是我过去为我的一个项目创建的示例配置,效果很好!

  1. 创建一个build.js
  2. 更改您的package.json,使其运行build.js

build.js

const rewire = require('rewire');const defaults = rewire('react-scripts/scripts/build.js');const config = defaults.__get__('config');// Consolidate chunk files insteadconfig.optimization.splitChunks = {  cacheGroups: {    default: false,  },};// Move runtime into bundle instead of separate fileconfig.optimization.runtimeChunk = false;// JSconfig.output.filename = '[name].js';// CSS. "5" is MiniCssPluginconfig.plugins[5].options.filename = '[name].css';config.plugins[5].options.publicPath = '../';

然后在我的package.json中,我像这样更改了npm脚本链接(将运行build.js脚本的节点构建)

package.json

"scripts": {    "start": "react-scripts start",    "build": "node build && gulp",    "test": "react-scripts test",    "eject": "react-scripts eject"  },

因此,如果您真的想从create-react-app中弹出,则只需运行

npm run-script eject

然后您将获得一个包含create-react-app使用的所有配置的新文件夹

但是正如我之前所说,没有理由不使用rewire而是覆盖配置而不是弹出

如果有帮助,请不要忘记将其标记为答案



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/427115.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号