我正在尝试在没有CRA的情况下建立React项目
之前,我已经成功地使用CDN设置了reactApp,所以这一次,我只想使用npm设置reactApp。
我安装了react,react-dom由npm.和index.html下面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="./src/index.js"></script>
</body>
</html>
下面的index.js
import React from "/react";
import { ReactDOM } from "react-dom";
const createEle = React.createElement;
const domContainer = document.querySelector("#root");
const root = ReactDOM.createRoot(domContainer);
root.render(createEle(LikeButton));
function LikeButton() {
const [liked, setLike] = React.useState(false); //
if (liked) {
domContainer.style.backgroundColor = "red";
return createEle("button", { onClick: () => setLike(false) }, "Hate");
} else {
domContainer.style.backgroundColor = "green";
return createEle("button", { onClick: () => setLike(true) }, "Like");
}
}
我不想用网络包,Babel。
但是我打开index.html之后就不行了,设置了webpack之后才行。
那么webpack是如何让reactApp活起来的呢?
很多人说,要设置reactApp没有CRA,它需要webpack,因为它捆绑了这么多复杂的文件。
但在我的情况下,我简化了应用程序,我只想运行它。
我想知道webpack在我的案例中的作用。(在这种情况下我需要webpack的目的
1条答案
按热度按时间tp5buhyn1#
Webpack注入
react
和reactdom
源代码要在没有webpack或其他模块捆绑器的情况下使用它,您需要添加react源代码
React cdn用于开发
将cdn用于生产
一个二个一个一个