2020/09/28 轮播react-slick报错 can`t resolve ‘react-slick‘

最新推荐文章于 2022-11-02 12:37:52 发布
原创 最新推荐文章于 2022-11-02 12:37:52 发布 · 874 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

博客作者遇到在项目中安装并使用react-slick时出现问题，原先通过cnpm安装，后改为使用npm安装发现有更新。文章揭示了cnpm可能导致的依赖不一致问题，并建议开发者在安装npm包时首选官方源，以确保获取最新和最稳定的版本。同时，提供了官方文档和相关教程链接供参考。

  • 报错
    在这里插入图片描述

  • 前提

  • 我已经按照官网安装好了
    npm install react-slick --save
    npm install slick-carousel --save
    并且引入了css样式
    import “~slick-carousel/slick/slick.css”;
    import “~slick-carousel/slick/slick-theme.css”;

  • 最后发现原因
    因为我安装了淘宝镜像，安装的时候喜欢用cnpm,结果我再重新用npm安装，发现有更新，应该就是cnpm的问题
    在这里插入图片描述
    其实之前cnpm我都安装过，以后安装还是最好用npm

  • 官网链接
    https://react-slick.neostack.com/docs/get-started

  • 可以参考的链接
    https://www.cnblogs.com/huangmin1992/p/7609727.html
    https://www.npmjs.com/package/react-slick

Centos7 安装clang、LLVM
古今来色色形形无非是戏,天地间奇奇怪怪何必认真.
05-17 4616
其中 -DLLVM_ENABLE_RTTI=ON 这个选项需要重点说明一下。由于我的目的是为了研究bpf技术，所以不可避免的会涉及到编译安装bpftrace这个工具。在编译bpftrace工程的时候如果没有打开 LLVM 的RTTI，会导致编译失败。而这个编译选项默认是关闭的，所以这里必须明确打开这个功能。这个python版本要求至少3.6以上，不然会报如下错误。clang 13.0.1 安装成功。1、LLVM所有版本下载路径。2、这里安装版本13.0.1。我这个编译4个小时左右完成。
VsCode中搭建Go开发环境（避坑）
lingmessy的博客
07-12 6129
VsCode搭建Go开发环境 一，安装go和vscode 此处有手就能搞定，略 二，配置国内镜像 配置国内镜像是为了解决众所周知的问题（fangqiang） 添加环境变量 变量名：GOPROXY 值：https://goproxy.cn 三，VScode安装插件 1，先安装Go插件 2，打开一个go文件 这时会有很多提示 这个时候再直接点 install all 就可以了 F5调试一下 ...
VS Code Go 插件
12-08
VSCode Go插件，下载直接解压放到GoPath\bin 下即可，不在为vscode不能下载安装而烦恼。
在Linux CentOS上编译并安装Clang 3.5.0
weixin_34413065的博客
02-18 358
编译CoreCLR需要Clang 3.5，而CentOS上安装的是Clang 3.4.2（yum repos中最新版也是这个），只能自己手工编译LLVM的源代码进行安装。 (注：CentOS的版本是6.6) 一、安装libstdc++4.7 (注：如果是CentOS 7.0，不需要这步) wget http://people.centos.org/tru/devtools-2/devt...
centos安装clang
sirria1的专栏
11-12 7935
1）下载llvm的源代码 1 2 3 wget -c http://llvm.org/releases/3.5.0/llvm-3.5.0.src.tar.xz tar llvm-3.5.0.src.tar.xz mv llvm-3.5.0.src llvm  2）下载clang的源代码，然后配置工具   1 ...
PS D:\project\Annotation\LP_Annotation_ConfigWeb> npm install -D tailwindcss npm error code ERESOLVE npm error ERESOLVE could not resolve npm error npm error While resolving: @ant-design/v5-patch-for-react-19@1.0.3 npm error Found: react@18.3.1 npm error node_modules/react npm error peer react@">=16.0.0" from @ant-design/cssinjs@1.24.0 npm error node_modules/@ant-design/cssinjs npm error @ant-design/cssinjs@"^1.21.0" from @ant-design/cssinjs-utils@1.1.3 npm error node_modules/@ant-design/cssinjs-utils npm error @ant-design/cssinjs-utils@"^1.1.3" from antd@5.27.3 npm error node_modules/antd npm error peer antd@">=5.22.6" from @ant-design/v5-patch-for-react-19@1.0.3 npm error node_modules/@ant-design/v5-patch-for-react-19 npm error 1 more (the root project) npm error @ant-design/cssinjs@"^1.23.0" from antd@5.27.3 npm error node_modules/antd npm error peer antd@">=5.22.6" from @ant-design/v5-patch-for-react-19@1.0.3 npm error node_modules/@ant-design/v5-patch-for-react-19 npm error @ant-design/v5-patch-for-react-19@"^1.0.3" from the root project npm error 1 more (the root project) npm error peer react@">=16.9.0" from @ant-design/cssinjs-utils@1.1.3 npm error node_modules/@ant-design/cssinjs-utils npm error @ant-design/cssinjs-utils@"^1.1.3" from antd@5.27.3 npm error node_modules/antd npm error peer antd@">=5.22.6" from @ant-design/v5-patch-for-react-19@1.0.3 npm error node_modules/@ant-design/v5-patch-for-react-19 npm error @ant-design/v5-patch-for-react-19@"^1.0.3" from the root project npm error 1 more (the root project) npm error 55 more (@ant-design/icons, @ant-design/react-slick, ...) npm error npm error Could not resolve dependency: npm error peer react@">=19.0.0" from @ant-design/v5-patch-for-react-19@1.0.3 npm error node_modules/@ant-design/v5-patch-for-react-19 npm error @ant-design/v5-patch-for-react-19@"^1.0.3" from the root project npm error npm error Conflicting peer dependency: react@19.1.1 npm error node_modules/react npm error peer react@">=19.0.0" from @ant-design/v5-patch-for-react-19@1.0.3 npm error node_modules/@ant-design/v5-patch-for-react-19 npm error @ant-design/v5-patch-for-react-19@"^1.0.3" from the root project npm error npm error Fix the upstream dependency conflict, or retry npm error this command with --force or --legacy-peer-deps npm error to accept an incorrect (and potentially broken) dependency resolution. npm error npm error npm error For a full report see: npm error C:\Users\48138\AppData\Local\npm-cache\_logs\2025-09-13T03_28_42_375Z-eresolve-report.txt npm error A complete log of this run can be found in: C:\Users\48138\AppData\Local\npm-cache\_logs\2025-09-13T03_28_42_375Z-debug-0.log
09-14
| `ERESOLVE could not resolve` | `@ant-design/v5-patch-for-react-19` 要求 `react@>=19.0.0` | 使用 `--legacy-peer-deps` | | 项目中已有 `react@18.3.1` | 版本不匹配 | 升级 React 或移除冲突包 | | 不想升级...
我的 React 最佳实践
「 虚幻私塾」
11-02 501
以上的相关实践，是本人在日积月累中总结和摸索出来的。如有雷同，说明你和我有一样的感受。
请分析以下报错：npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: mobx-react@6.3.1 npm ERR! Found: react@18.3.1 npm ERR! node_modules/react npm ERR! react@"^18.2.0" from the root project npm ERR! peer react@">=16.0.0" from @ant-design/cssinjs@1.20.0 npm ERR! node_modules/@ant-design/cssinjs npm ERR! @ant-design/cssinjs@"^1.19.1" from antd@5.18.0 npm ERR! node_modules/antd npm ERR! antd@"^5.18.0" from the root project npm ERR! 2 more (antd-img-crop, fabos-commons) npm ERR! 80 more (@ant-design/icons, @ant-design/react-slick, ...) npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@"^16.8.0 || 16.9.0-alpha.0" from mobx-react@6.3.1 npm ERR! node_modules/mobx-react npm ERR! mobx-react@"6.3.1" from the root project npm ERR! mobx-react@"^6.3.1" from amis@0.0.29 npm ERR! node_modules/amis npm ERR! amis@"^0.0.29" from the root project npm ERR! 3 more (amis-editor, amis-editor-core, amis-theme-editor-helper) npm ERR! 3 more (amis-core, amis-editor-core, amis-ui) npm ERR! npm ERR! Conflicting peer dependency: react@16.14.0 npm ERR! node_modules/react npm ERR! peer react@"^16.8.0 || 16.9.0-alpha.0" from mobx-react@6.3.1 npm ERR! node_modules/mobx-react npm ERR! mobx-react@"6.3.1" from the root project npm ERR! mobx-react@"^6.3.1" from amis@0.0.29 npm ERR! node_modules/amis npm ERR! amis@"^0.0.29" from the root project npm ERR! 3 more (amis-editor, amis-editor-core, amis-theme-editor-helper) npm ERR! 3 more (amis-core, amis-editor-core, amis-ui) npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! E:\install\Integrated Development Environment\node_cache\_logs\2025-03-24T06_16_27_089Z-eresolve-report.txt npm ERR! A complete log of this run can be f
03-25
好的，我现在需要解决用户遇到的npm安装时的ERESOLVE错误，具体是mobx-react@6.3.1和React@18.3.1之间的版本冲突。用户提到使用--force或--legacy-peer-deps参数可能有效，但想了解具体原因和更好的解决方案。 首先...
{ "name": "edx", "version": "0.1.0", "repository": "https://github.com/openedx/edx-platform", "scripts": { "postinstall": "scripts/copy-node-modules.sh", "build": "npm run webpack && npm run compile-sass", "build-dev": "npm run webpack-dev && npm run compile-sass-dev", "webpack": "cross-env NODE_ENV=development webpack --config webpack.dev.config.js", "webpack-dev": "NODE_ENV=development webpack --config=webpack.dev.config.js", "compile-sass": "scripts/compile_sass.py --env=${NODE_ENV:-production}", "compile-sass-dev": "scripts/compile_sass.py --env=development", "watch": "{ npm run watch-webpack& npm run watch-sass& } && sleep infinity", "watch-webpack": "npm run webpack-dev -- --watch", "watch-sass": "scripts/watch_sass.sh", "test": "npm run test-jest && npm run test-karma", "test-jest": "jest", "test-karma": "npm run test-karma-vanilla && npm run test-karma-require && echo 'WARNING: Skipped broken webpack tests. For details, see: https://github.com/openedx/edx-platform/issues/35956'", "test-karma-vanilla": "npm run test-cms-vanilla && npm run test-xmodule-vanilla && npm run test-common-vanilla", "test-karma-require": "npm run test-cms-require && npm run test-common-require", "test-karma-webpack": "npm run test-cms-webpack && npm run test-lms-webpack && npm run test-xmodule-webpack", "test-karma-conf": "${NODE_WRAPPER:-xvfb-run --auto-servernum} node --max_old_space_size=4096 node_modules/.bin/karma start --single-run=true --capture-timeout=60000 --browsers=FirefoxNoUpdates", "test-cms": "npm run test-cms-vanilla && npm run test-cms-require && npm run test-cms-webpack", "test-cms-vanilla": "npm run test-karma-conf -- cms/static/karma_cms.conf.js", "test-cms-require": "npm run test-karma-conf -- cms/static/karma_cms_squire.conf.js", "test-cms-webpack": "npm run test-karma-conf -- cms/static/karma_cms_webpack.conf.js", "test-lms": "npm run test-jest && npm run test-lms-webpack", "test-lms-webpack": "npm run test-karma-conf -- lms/static/karma_lms.conf.js", "test-xmodule": "npm run test-xmodule-vanilla && npm run test-xmodule-webpack", "test-xmodule-vanilla": "npm run test-karma-conf -- xmodule/js/karma_xmodule.conf.js", "test-xmodule-webpack": "npm run test-karma-conf -- xmodule/js/karma_xmodule_webpack.conf.js", "test-common": "npm run test-common-vanilla && npm run test-common-require", "test-common-vanilla": "npm run test-karma-conf -- common/static/karma_common.conf.js", "test-common-require": "npm run test-karma-conf -- common/static/karma_common_requirejs.conf.js" }, "dependencies": { "@babel/core": "7.26.0", "@babel/plugin-proposal-object-rest-spread": "^7.18.9", "@babel/plugin-transform-object-assign": "^7.18.6", "@babel/preset-env": "^7.19.0", "@babel/preset-react": "7.26.3", "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2", "@edx/edx-bootstrap": "1.0.4", "@edx/edx-proctoring": "^4.18.1", "@edx/frontend-component-cookie-policy-banner": "2.2.0", "@edx/paragon": "2.6.4", "@edx/studio-frontend": "^2.1.0", "@testing-library/jest-dom": "^6.6.3", "@testing-library/react": "^12.1.5", "@testing-library/user-event": "^12.8.3", "babel-loader": "^9.1.3", "babel-plugin-transform-class-properties": "6.24.1", "babel-polyfill": "6.26.0", "backbone": "1.6.0", "backbone-associations": "0.6.2", "backbone.paginator": "2.0.8", "bootstrap": "4.0.0", "camelize": "1.0.1", "classnames": "2.5.1", "cross-env": "^10.0.0", "css-loader": "7.1.2", "datatables": "1.10.18", "datatables.net-fixedcolumns": "5.0.4", "edx-ui-toolkit": "1.8.7", "exports-loader": "0.6.4", "file-loader": "^6.2.0", "font-awesome": "4.7.0", "hls.js": "0.14.17", "imports-loader": "0.8.0", "jest-environment-jsdom": "^29.0.0", "jquery": "2.2.4", "jquery-migrate": "1.4.1", "jquery.scrollto": "2.1.3", "js-cookie": "3.0.5", "moment": "2.30.1", "moment-timezone": "0.5.47", "node-gyp": "11.1.0", "popper.js": "1.16.1", "prop-types": "15.8.1", "raw-loader": "0.5.1", "react": "16.14.0", "react-dom": "16.14.0", "react-focus-lock": "^1.19.1", "react-redux": "5.1.2", "react-router-dom": "5.3.4", "react-slick": "0.30.3", "redux": "3.7.2", "redux-thunk": "2.2.0", "requirejs": "2.3.7", "rtlcss": "4.3.0", "sass": "^1.54.8", "sass-loader": "^16.0.0", "scriptjs": "2.5.9", "style-loader": "4.0.0", "svg-inline-loader": "0.8.2", "uglify-js": "3.19.3", "underscore": "1.13.7", "underscore.string": "3.3.6", "webpack": "^5.90.3", "webpack-bundle-tracker": "3.2.0", "webpack-merge": "6.0.1", "which-country": "1.0.0" }, "devDependencies": { "@edx/mockprock": "1.0.2", "@edx/stylelint-config-edx": "2.3.3", "babel-jest": "29.7.0", "jasmine-core": "2.6.4", "jasmine-jquery": "2.1.1", "jest": "29.7.0", "karma": "0.13.22", "karma-chrome-launcher": "3.2.0", "karma-coverage": "2.2.1", "karma-firefox-launcher": "2.1.3", "karma-jasmine": "0.3.8", "karma-jasmine-html-reporter": "0.2.2", "karma-junit-reporter": "2.0.1", "karma-requirejs": "1.1.0", "karma-selenium-webdriver-launcher": "latest", "karma-sourcemap-loader": "0.4.0", "karma-spec-reporter": "0.0.20", "karma-webpack": "^5.0.1", "plato": "1.7.0", "react-test-renderer": "16.14.0", "selenium-webdriver": "^2.44.0", "sinon": "19.0.2", "squirejs": "0.1.0", "string-replace-loader": "^3.1.0", "stylelint-formatter-pretty": "4.0.1", "webpack-cli": "^5.1.4" } }
最新发布
09-25
Module not found: Error: Can't resolve 'templates/license-selector.underscore' ``` #### **解决方案** ##### **(1) 检查文件是否存在** - **命令验证**： ```bash # 以 `license-selector.underscore` 为例 ...
Error: Cannot find module ‘umi‘ 问题处理
热门推荐
LDR1109的博客
04-23 1万+
最近接触ant design，再上手的时候，老是会碰到，找不到某某模块的问题，上网搜了一下，发现很多都不能解决问题。 后来，发现可以通过 yarn add 模块名 的方式，处理这种Error, 如: yarn add umi 记录一下，希望也可以帮到您！ NangongYi@LAPTOP-AKD59FEP MINGW64 /d/web/html/ant/myapp $ yarn add umi yarn add v1.22.10 info No lockfile found. [1/4] .
VScode的go语言插件
09-06
VScode的go语言插件，离线安装可以直接解压到C:\Users\[用户名]\.vscode\extensions目录下，VScode安装后的插件都在这个目录
VScode 下 go的插件，运行环境。
01-04
VScode 下 go的插件，运行环境。。go path下的工具集。
CentOS7下安装clang
Edidaughter的博客
01-19 9893
之前找源码安装一直没有安装上，然后直接yum了，头疼，浪费了一晚上的时间，之后有空再看看源码安装出了什么事情吧. yum的方法安装clang的步骤： 1.sudo yum install epel-release 2.sudo yum install clang 如果yuminstall clang直接就可以的话也不用第一个步骤. ...............
VSCODE GO插件
weixin_39126191的博客
03-21 1224
1、安装Git，网上搜索Git下载，并安装 2、配置Git环境变量，把Git安装路径添加到系统PATH中 打开VSCODE安装插件 打开VSCODE,随便新建一个go文件，打开文件，点击右下角Analysis Tools Missing gocode gopkgs go-outline go-sysmbols guru gorename gomodifytags goplay 有的安装成功，有的...
vscode 安装go插件
weixin_46880197的博客
11-20 425
vscode 安装go插件 用vscode新建一个go文件 使用go mod 代理来安装 从https://studygolang.com/dl下载go1.14.6.windows-amd64.msi安装即可，安装路径选择默认，安装完成后会自动帮你配置环境变量不用自己配置了 打开cmd，查看是否安装完成 在这里插入图片描述 这样就代表已经成功安装了 用vscode新建一个go文件 在这里插入图片描述 vscode会提示你安装go插件 点击install all 这时候会安装失败 Installing git
CentOS 6.5 安装Clang 3.5.0
weixin_30689307的博客
06-28 184
来自引用: http://www.cnblogs.com/dudu/p/4294374.html 编译llvm几乎耗费了1个小时….. 编译CoreCLR需要Clang 3.5，而CentOS上安装的是Clang 3.4.2（yum repos中最新版也是这个），只能自己手工编译LLVM的源代码进行安装。 (注：CentOS的版本是6.6) 一、安装libstdc++...
windows vscode安装go插件
jiaojinlin的博客
01-30 2322
vscode中有很多go的相关插件，非常好用如下： gocode gopkgs go-outline go-symbols guru gorename gomodifytags goplay impl godef goreturns golint gotests dlv 但是使用vscode 检查插件安装，会出现安装失败的情况。 下面介绍如何安装失败的插件 进行如下命令进行目录切换： cd ...
vscode——配置go插件
weixin_30458043的博客
05-11 96
前言 这个真的折腾死我了,看了N多博客才弄好 这两个还是比较有用的~ https://www.cnblogs.com/nickchou/p/9038114.html https://www.jianshu.com/p/83beca927c9e 步骤 安装go插件 配置GO "go.gopath": "D:\\wamp\\www\\Go", //工作空间 "g...
ReactJs轮播实现教程：使用react-slick创建交互式示例
资源摘要信息:"在ReactJs项目中创建轮播效果，可以通过使用react-slick库来实现。react-slick是一个强大的轮播组件，适用于ReactJs环境，能够简单快捷地构建出响应式轮播图。该教程以英文编写，主要面向初学者，提供...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值