我基本上是从React开始的，我将继续学习本教程https://reactjs.org/docs/hello-world.html和React入门指南https://reactjs.org/docs/add-react-to-a-website.html.
我的模板现在看起来像这样：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>HTML 5 Boilerplate</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="root"></div>
<script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script type="text/babel">
ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('root')
);
</script>
</body>
</html>
这是可行的，但我想尝试的一些包没有CDN来加载它们。明确地https://www.draftail.org/docs/getting-started.
我是否必须先用npm init -y，然后用npm install --save draftail draft-js@0.10.5 react react-dom来设置节点环境？但我已经通过CDN进行了react安装，所以我现在该怎么办，因为我不知道这些包是否会冲突。
此时，我如何将node_modules中安装的东西与CSS文件一起带到浏览器中？
如果包不以即时浏览器消费的格式存在，正确的方法是从Node构建应用程序，以便导入包并使用它。
您必须删除所有这些脚本标记：
<script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script type="text/babel">
ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('root')
);
</script>
相反，一旦你的Node项目设置好，就可以使用Webpack(或者你正在使用的任何bundler(的捆绑输出脚本，并将其托管在你的网站上。它可能看起来像
<script src="bundle.js"></script>
过渡到基于节点的项目还有其他好处：
- 所有的传输工作现在都将在服务器上为每个构建完成一次，而不是每次客户端加载页面时
- 很容易设置构建过程来自动缩小发送到客户端的代码，从而降低带宽需求
- 您也可以很容易地要求使用polyfill
请注意，创建react应用程序是react项目的一个很好的入门样板-只需安装它，你就不必麻烦太多的设置，你就可以开始编写你想要的代码了。