网站开发 平台建设视频号广告推广
记一次跑前端老项目的问题
- 一、前言
- 二、过程
- 1、下载依赖
- 2、启动项目
- 3、打包
一、前言
在一次跑前端老项目的时候，遇到了一些坑，这里记录一下。
二、过程
1、下载依赖
使用
npm install
下载很久，然后给我报了个错
core-js@2.6.12: core-js@❤️.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
出现这个问题先看看有没有使用淘宝的镜像，或者使用过期的淘宝镜像
查看镜像地址，使用如下命令：
npm config get registry
可以看到我这里还是默认的镜像地址，改为淘宝镜像的地址，这是最新的地址，地址如下：
https://registry.npmmirror.com
命令如下：
npm config set registry https://registry.npmmirror.com
如果看到几年前的教程，可能淘宝镜像的地址是这样：
https://registry.npm.taobao.org
这个地址不能用了！！！
这个地址不能用了！！！
这个地址不能用了！！！
重要的事情说三遍，别问我怎么知道的。。。
如果是在近期看到这篇博客，可以用我前面的地址，如果几年后看到，建议先搜索一下最新的淘宝镜像地址。
回到正题，为了试试效果，这里删除 node_modules
重新下载
npm install
如果此时卡在这里
core-js@2.6.12: core-js@❤️.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.
Ctrl + C 退出，此应该升级 core-js 了，命令如下：
npm i core-js
然后再删除 node_modules ，重新下载
npm install
完成
2、启动项目
先看看能不能启动，先使用如下命令查看启动命令
npm run
所以启动命令为：
npm run serve
如果启动报如下错：
Error: error:0308010C:digital envelope routines::unsupported
这是因为 node 的版本高了，从图中可以看到我的 node 版本为 18 ，换回 17 及以下的版本即可解决。
也可以使用如下命令：
$env:NODE_OPTIONS="--openssl-legacy-provider"
然后重新启动
npm run serve
启动成功
3、打包
先试试能不能成功打包，命令如下：
npm run build
如果出现如下错：
Error: Cannot find module ‘imagemin-gifsicle’
需要删除 node_modules 中的 image-webpack-loader
然后使用如下命令更新下载：
cnpm install --save-dev image-webpack-loader
如果使用命令报错
cnpm : 无法加载文件 C:\Users\33530\AppData\Roaming\npm\cnpm.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Poli
cies。
千万不能使用 npm install --save-dev image-webpack-loader 下载，如果使用此命令下载不会报错，看起来是成功了，但是打包会报错。。。
别试了，我已经试过了，不行
此时应该以管理员的身份打开命令行窗口，输入如下命令
set-ExecutionPolicy RemoteSigned
然后安装 cnpm ，命令如下：
npm install -g cnpm --registry=https://registry.npmmirror.com
我这里因为安装过了，所以比较快，安装完成后再使用如下命令：
cnpm install --save-dev image-webpack-loader
下载完成后再次打包
npm run build
打包成功