webpack打包报错

article/2025/9/24 13:43:24

在执行npm run build对项目进行打包的时候遇到webpack打包报错的问题

     在网上找到各种方法去解决,什么node版本不兼容啊重装node啊,什么saas没装好python环境啊,webpack版本兼容问题啊!总之各种说法都看着去尝试解决了,但是都没能解决这个打包的问题,这个问题一直困扰了我好几天。

     最终看到一篇比较靠谱的解决方案就是将webpack版本写死最终将这个困扰我良久的问题给解决了。右边为正确的解决方法!

  这个问题产生的原因就是在我们拉代码npm i去下载依赖的时候package.json的依赖包下载的结果是"html-webpack-plugin": "^4.0.0-alpha",这可能是npm i 在下载依赖的时候自动将html-webpack-plugin更新到^4.0.0-alpha而并不是固定版本。不过我看了下仓库代码,这完全是人为合代码的时候直接把pack.json里面的html-webpack-plugin": "^4.0.0-alpha"合进去了,所以各位小伙伴在合代码的时候记得忽略掉package.json不然害人又害己。尤其是像我这种经验不够丰富,第一次解决webpack相关的问题真的被坑惨了。

 


http://chatgpt.dhexx.cn/article/exJXBRIP.shtml

相关文章

webpack打包css

webpack打包 1.打包css2.打包逻辑1-1.webpack打包css逻辑 3.打包css4.打包成独立的css文件5.添加样式前缀6.格式校验7.压缩css8.我们为什么要用这个打包工具呢9.webpack的打包顺序10.总结 1.打包css 2.打包逻辑 1-1.webpack打包css逻辑 非js文件打包 需要对应的loadercss-loa…

初识webpack打包

初识webpack打包,小白入门 前言: webpack是一款基于node的构建工具,其中一大特色就是打包 因为现在前端已经工程化开发,写的代码已经不能直接在浏览器上运行了 这时候webpack会帮你把代码进行编译,打包成浏览器识别的…

webpack打包分析

分析一:打包的时间分析 如果我们希望看到每一个loader、每一个Plugin消耗的打包时间,可以借助于一个插件:speed-measure-webpack-plugin注意:该插件在最新的webpack版本中存在一些兼容性的问题(和部分Plugin不兼容&am…

如何使用Webpack打包

简单的说了一下webpack是干嘛的,和webpack如何安装,如何进行打包,步骤很详细,感兴趣的同学可以试着操作一下。 文章目录 1、webpacks是什么?2、Webpack安装3、初始化项目4、使用webpack进行JS打包5、使用webpack进行CS…

webpack打包优化配置

文章目录 前言不进行任何打包配置代码分离splitChunkruntimeChunk动态导入 css文件处理css文件提取css文件压缩css实现Tree Shaking js实现Tree shakingTerserscope Hoisting打包优化没效果打包界面显示分析总结 前言 之前使用webpack进行项目搭建配置时,都是操作一…

webpack打包路径更改_webpack打包教程

创建package.json文件 命令:npm init 安装webpack npm install --save-dev webpack npm install --save-dev webpack-cli 全局安装: npm install --global webpack webpack-cli 打包 默认entry入口 src/index.js 默认output出口 dist/main.js 打包模式: webpack --mode deve…

Vue基础知识总结 9:vue webpack打包原理

🏆作者简介:哪吒,CSDN2022博客之星Top1、CSDN2021博客之星Top2、多届新星计划导师✌、博客专家💪,专注Java硬核干货分享,立志做到Java赛道全网Top N。 🏆本文收录于,Java基础教程系列…

webpack 打包流程

流程梳理 在开始之前我们先对于整个打包流程进行一次梳理。 这里仅仅是一个全流程的梳理,现在你没有必要非常详细的去思考每一个步骤发生了什么,我们会在接下来的步骤中去一步一步带你串联它们。 整体我们将会从上边5个方面来分析Webpack打包流程: 初…

Webpack打包

webpack【依赖node环境】 什么是webpack? 从本质上将,webpack是一个现代的JavaScript应用的静态模板打包工具。 前端模块化: 前端模块化是指,通过将前端代码根据一定的规则解耦封装成几个代码文件(模块)&…

使用webpack打包vue项目

使用webpack打包vue项目 安装webpack工具,安装方式有两种:全局安装(命令:npm install -g webpack webpack-cli)以及安装在项目中,这里使用第二种: //在项目中安装,这里的-D表示运用到…

Idea 2017.3.+永久破解方法

一、下载Intellij IDEA2017.3.5x64旗舰版 去官网下载此处不赘述 二、下载破解jar包 链接在此http://idea.lanyus.com/jar/JetbrainsCrack-2.7-release-str.jar 三、打开安装好的IDEA路径下的bin目录 将下载好的jar包复制进来 例如 四、修改bin目录下的两个文件 idea.exe…

InetlliJ IDEA 2017破解(亲测,可用)

1.InetlliJ安装好后,启动,至License Activation界面; 2.选择License server; 3.在License server address中填入 http://idea.imsxm.com/

Intellij IDEA2017安装破解

IntelliJ IDEA(2017)安装和破解 IDEA 全称 IntelliJ IDEA,是Java语言开发的集成环境,IntelliJ在业界被公认为最好的java开发工具之一,尤其在智能代码助手、代码自动提示、重构、J2EE支持、各类版本工具(Git、svn、gith…

idea 2017 破解 可以使用

新版本的 自从升级到idea2017.3之后,之前的license server破解方法貌似已失效.于是找到大神用的破解插件,很好很强大. 安装好idea之后不要打开软件,从http://idea.lanyus.com/下载破解插件,这里面的插件是进行更新的,可能已经不是下面的文件名了&#xf…

IntelliJ idea2017 安装破解

下载 idea的安装包可以去官网下载,地址:IDEA各个历史版本请点击下载,选择自己需要的版本进行下载,本人下载的是ideaIU-2017.3.6.exe版本专业版。 安装 1、开始安装, 双击ideaIU-2017.3.6.exe,运行安装文…

intelliJ idea 2017破解

一、先进入Intellij IDEA的官网:https://www.jetbrains.com,下载安装 二、破解。 网上的破解方法较多,总结下来大概有下面几种办法供大家作为参考 声明:破解用于学习和试用,如果有经济条件的话,请支持…

idea 2017 破解方法

一、先进入Intellij IDEA的官网:https://www.jetbrains.com,下载安装 二、破解。 网上的破解方法较多,总结下来大概有下面几种办法供大家作为参考 声明:破解用于学习和试用,如果有经济条件的话,请支持…

IDEA 2017破解补丁方法

本文使用破解方式注册。 下载破解文件JetbrainsCrack-2.6.2.jar 下载地址: http://download.csdn.net/detail/gnail_oug/9824630 http://idea.lanyus.com/ 开始破解 一、将下载的 JetbrainsCrack-2.6.2.jar 破解补丁放在你的安装idea下面的bin的目录下面&#xff0…

INTELLIJ IDEA 2017 破解教程(2018也可以!)

INTELLIJ IDEA 破解教程 我们一般都用licence server来激活idea,网上传闻较广的licence server是 http://idea.iteblog.com/key.php,但是该server在2017年12月后就失效了,故我们现在不用licence server,直接破解吧! …

IDEA 2017 破解 license 激活

IDEA 2017 破解 license 激活 转自:http://blog.csdn.net/zhangwenwu2/article/details/54948959 进入ide主页面,help-register-license server,然后输入 http://idea.iteblog.com/key.php(注意:php要小写)即可~ 如下图…