没有 npm 的反应 - 是否可以导入库/模块？答案

【问题标题】：React without npm - is it possible to import libraries / modules?没有 npm 的反应 - 是否可以导入库/模块？
【发布时间】：2017-06-29 04:01:11
【问题描述】：

我正在使用没有 npm 的 React（由于服务器端的限制）。在我的<head> 标签中，我有以下内容

<script src="https://unpkg.com/react@15.4.2/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.4.2/dist/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.js"></script>

我的反应代码被打包在一个text/babel 脚本标签中，并且运行良好。简化示例：

<script type="text/babel">
    ReactDOM.render(
        <h1>Hello, world!</h1>,
        document.getElementById('root')
    );    
</script>

我想使用一个外部模块来绘制图表。但是，如果我使用https://github.com/reactjs/react-chartjs（只需下载它并在本地提供），通过包含

任何一个

<script type="text/javascript" src="/js/react-chartjs/chart.js"></script>

或

<script type="text/babel" src="/js/react-chartjs/chart.js"></script>

抛出错误：

ReferenceError: require is not defined

大概是因为require 是一个 npm 命令。我尝试过使用 require.js，但同样会引发错误。同样，如果我从

提供 chart.js 的 javascript 版本

https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js

在我的text/babel 脚本标签中尝试将库包含在任何

中

// Using CommonJS
var Chart = require('chart.js')
var myChart = new Chart({...})

// ES6
import Chart from 'chart.js'
let myChart = new Chart({...})

// Using requirejs
require(['path/to/Chartjs'], function(Chart){
 var myChart = new Chart({...})
})

它也会引发错误。有没有办法在没有 npm 的情况下使用 react 导入普通的 javascript 库或 react 模块？

【问题讨论】：

尝试在你的项目中包含这个。 cdnjs.cloudflare.com/ajax/libs/react-chartjs/0.8.0/…
哎呀没有 npm？你能详细说明这个限制吗？这是 2015 年后任何类型的客户端开发的主要拐杖
@azium 那么这是否意味着它根本不可能？我的意思是我们可以在不编译的情况下使用代码更快。在我看来。

标签： javascript reactjs chart.js

【解决方案1】：

好的，这是一个使用 PHP 的可怕 hack，但它是我找到的唯一选择。我也没有可用的 npm 服务器。因此，我没有使用 javascript 导入或包管理器，例如 browserify，因为它们仍然需要 npm，所以它们不起作用，我使用 PHP 从多个文件创建单个大内容：

<script type="text/babel">

<?php

include 'BDRMLElement.js';

?>

...

class App extends React.Component {
 ...
 render() {
   return (
        <div>
          <BDRMLElement />
...

</script>

【讨论】：

到现在还有效吗？为什么它与使用 text/babel 不同？我真的很想知道。