Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

启动失败 #3

Open
BoykaCheng opened this issue Aug 18, 2023 · 11 comments
Open

启动失败 #3

BoykaCheng opened this issue Aug 18, 2023 · 11 comments

Comments

@BoykaCheng
Copy link

image
run后报错,如图所示,请教大佬

@xzpgzy
Copy link

xzpgzy commented Sep 13, 2023

楼主现在问题解决了吗?

@yizhima
Copy link

yizhima commented Sep 20, 2023

遇到同样的问题,不知道啥原因

@liuyueyi
Copy link
Collaborator

应该是版本问题,贴一下 nodejs, npm 版本

@xzpgzy
Copy link

xzpgzy commented Sep 20, 2023

应该是版本问题,贴一下 nodejs, npm 版本

node -v 18.12.1 npm -v 9.2.0 yarn -v 1.22.19 这三个版本是这些,捣鼓挺久,但是没有解决

@ehZyiL
Copy link

ehZyiL commented Sep 20, 2023

$ node -v
v16.20.1
$ npm -v
8.19.4
同样遇到上述问题 按ESC后 这个错误页面消息 但一直加载进不去
image

@weedien
Copy link

weedien commented Sep 29, 2023

对于提示信息 [ error ReactDOM.render is deprecated since React 18.0.0, use createRoot instead, see https://reactjs.org/link/switch-to-createroot react/no-deprecated ],可以通过添加注释 // eslint-disable-next-line react/no-deprecated 来解决。

// ......
// react 17 创建,控制台会报错,暂时不影响使用(菜单折叠时不会出现闪烁)
// eslint-disable-next-line react/no-deprecated
ReactDOM.render(
	<Provider store={store}>
		<PersistGate persistor={persistor}>
			<App />
		</PersistGate>
	</Provider>,
	document.getElementById("root")
);

或者采用React18中的方式改写代码。注意,需要将import ReactDOM from "react-dom"改为import ReactDOM from "react-dom/client"。

import ReactDOM from "react-dom/client";
import { Provider } from "react-redux";
import { PersistGate } from "redux-persist/integration/react";

import App from "@/App";
import { persistor, store } from "@/redux";

import "@/styles/reset.less";
import "@/assets/iconfont/iconfont.less";
import "@/assets/fonts/font.less";
import "@/styles/common.less";
import "virtual:svg-icons-register";

// react 17 创建,控制台会报错,暂时不影响使用(菜单折叠时不会出现闪烁)
ReactDOM.createRoot(document.getElementById("root")!).render(
	<Provider store={store}>
		<PersistGate persistor={persistor}>
			<App />
		</PersistGate>
	</Provider>
);

另外,当我在开发模式下运行项目时(即运行npm run dev),会遇见以下错误,使得页面一直无法加载,但打包之后(即运行npm run build:pro)不存在这个问题。
image

解决方法为注释或删除vite.config.ts中的以下代码(框内的代码),至于为什么这段配置会产生问题,我目前还不清楚。
image

@KarsonYu
Copy link

对于提示信息 [ error ReactDOM.render is deprecated since React 18.0.0, use createRoot instead, see https://reactjs.org/link/switch-to-createroot react/no-deprecated ],可以通过添加注释 // eslint-disable-next-line react/no-deprecated 来解决。

// ......
// react 17 创建,控制台会报错,暂时不影响使用(菜单折叠时不会出现闪烁)
// eslint-disable-next-line react/no-deprecated
ReactDOM.render(
	<Provider store={store}>
		<PersistGate persistor={persistor}>
			<App />
		</PersistGate>
	</Provider>,
	document.getElementById("root")
);

或者采用React18中的方式改写代码。注意,需要将import ReactDOM from "react-dom"改为import ReactDOM from "react-dom/client"。

import ReactDOM from "react-dom/client";
import { Provider } from "react-redux";
import { PersistGate } from "redux-persist/integration/react";

import App from "@/App";
import { persistor, store } from "@/redux";

import "@/styles/reset.less";
import "@/assets/iconfont/iconfont.less";
import "@/assets/fonts/font.less";
import "@/styles/common.less";
import "virtual:svg-icons-register";

// react 17 创建,控制台会报错,暂时不影响使用(菜单折叠时不会出现闪烁)
ReactDOM.createRoot(document.getElementById("root")!).render(
	<Provider store={store}>
		<PersistGate persistor={persistor}>
			<App />
		</PersistGate>
	</Provider>
);

另外,当我在开发模式下运行项目时(即运行npm run dev),会遇见以下错误,使得页面一直无法加载,但打包之后(即运行npm run build:pro)不存在这个问题。 image

解决方法为注释或删除vite.config.ts中的以下代码(框内的代码),至于为什么这段配置会产生问题,我目前还不清楚。 image

改了最后那个之后文章审核的格式都没了

@weedien
Copy link

weedien commented Oct 12, 2023

@KarsonYu 你是指文章管理界面的格式吗,可以具体说说是在哪个路由下的哪个页面

@KarsonYu
Copy link

@KarsonYu 你是指文章管理界面的格式吗,可以具体说说是在哪个路由下的哪个页面

对,不能调整文章的状态
image

@weedien
Copy link

weedien commented Oct 12, 2023

@KarsonYu 那你上面的搜索栏中的选项中有数据吗
image

{
	title: "状态",
	dataIndex: "status",
	key: "status",
	render(_, item) {
		const { articleId, status } = item;
		return <Select 
						// 如果 status 为 1 那么 status 为 warning
						status={status === 1 ? "" : "error"}
						value={status.toString()} 
						options={PushStatusList}
						onChange={(value) => handleStatusChange(articleId, Number(value))}
					>
					</Select>;
	}
},

其中options={PushStatusList}用于设置下拉框的选项。该问题可能是由PushStatusList中的数据为空而导致的,你可以试着在控制台中输出它的值。

这个数据来自于后端,对应dict_common表;在前端项目中由redux管理,对应状态disc;在组件article/index.tsx中,通过const { PushStatusList, ToppingStatusList, OfficalStatusList} = props || {};从props中解析(redux会将disc中的数据以props的形式传递给组件)

@KarsonYu
Copy link

// eslint-disable-next-line react/no-deprecated

解决了,React18中的方式改写代码导致的,必须得用第一种方法改写

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants