Fatal编程技术网
  • javascript/
  • Javascript 是否可以在浏览器中加载外部库？

Javascript 是否可以在浏览器中加载外部库？

javascript reactjs

Javascript 是否可以在浏览器中加载外部库？,javascript,reactjs,Javascript,Reactjs,当我在浏览器中加载react时，我无法“npm安装”一个库，然后将其包含在react代码中： var somelibrary = require('somelibrary'); 我想知道我该如何在浏览器中实现它，它是否像加载react后运行源文件一样简单。像 <script src="somereactlibrary.js"></script> 或者库是否有一堆文件/依赖项，而且不会那么容易？（如果库只是一个文件，那么技术上可能吗？） 这是reactjs.org中

当我在浏览器中加载react时，我无法“npm安装”一个库，然后将其包含在react代码中：

var somelibrary = require('somelibrary');
我想知道我该如何在浏览器中实现它，它是否像加载react后运行源文件一样简单。像

<script src="somereactlibrary.js"></script>
或者库是否有一堆文件/依赖项，而且不会那么容易？（如果库只是一个文件，那么技术上可能吗？）

这是reactjs.org中的代码，用于在浏览器中显示react：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Hello World</title>
    <script src="https://unpkg.com/react@16/umd/react.development.js"></script>
    <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>

    <!-- Don't use this in production: -->
    <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
  </head>
  <body>
    <div id="root"></div>
    <script type="text/babel">

      ReactDOM.render(
        <h1>Hello, world!</h1>,
        document.getElementById('root')
      );

    </script>
    <!--
      Note: this page is a great way to try React but it's not suitable for production.
      It slowly compiles JSX with Babel in the browser and uses a large development build of React.

      Read this section for a production-ready setup with JSX:
      http://reactjs.org/docs/add-react-to-a-website.html#add-jsx-to-a-project

      In a larger project, you can use an integrated toolchain that includes JSX instead:
      http://reactjs.org/docs/create-a-new-react-app.html

      You can also use React without JSX, in which case you can remove Babel:
      https://reactjs.org/docs/react-without-jsx.html
    -->
  </body>
</html>


你好，世界
ReactDOM.render(
你好，世界！，
document.getElementById（'root'））
);
要在浏览器中呈现React，您需要
React
和
React dom
库。如果您无法访问可以将所有代码捆绑在一起的构建步骤，其他库可以像您所说的那样作为单独的脚本标记加载

示例

ReactDOM.render(
React.createElement（'div'，{}，moment（）.format（'YYYY-MM-DD'），
document.getElementById（'root'））
);



您可以通过脚本标记加载任何需要的内容，与React无关。依赖关系管理会有问题，这就是为什么存在各种捆绑机制的原因。@DaveNewton谢谢，如果我主要创建自己的组件，这还会是个问题吗？或者有哪些示例库是我需要的，但我无法以这种方式加载。我这样做的原因是为了一个小的快速项目，我不想处理构建/网页包等。如果没有依赖关系，就没有依赖关系。您可以通过这种方式加载任何库——它只是JS。就我个人而言，我不认为在浏览器React中胡闹是值得的：从你第一次问起到现在，你可以让一切都运行起来，例如，通过创建React应用程序。@DaveNewton是的。。我一直在使用CreateReact应用程序。但是它的大小（数百mb）和构建步骤对于我创建的非常小的实用程序来说似乎有点太多了。对于大型项目，cra绝对有用。@foreyez我喜欢使用一个可以为所有目标构建的现代开发环境。可能值得一看。库不应该包含在react/react dom之后吗？也许不是瞬间，而是一个依靠react@foreyez是的，你说得对。如果你没有任何的构建步骤，那就会变得很麻烦。您需要确保先手动加载其他库的潜在依赖项。