标签: unpkg
为什么UNPKG可以免费使用，过度使用会怎样？
我知道UNPKG快速、可靠且免费使用，但如果我过度使用它，会发生什么？
例如，我可以使用rollup而不是webpack将我的整个网站作为UMD构建捆绑到单个 JS，并将其发布为NPM包，如果我使用React或Vue或任何其他 SPA 方法，我需要的 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>My Website</title>
<script src="https://unpkg.com/my-whole-website-umd"></script>
</head>
<body>
<div id="root"></div>
</body>
</html>
UNPKG 甚至帮助我获取最新版本，这意味着如果我将我的新包发布到 NPM，我正在生产的整个网站都会更新：
<!-- this will always be the latest -->
<script src="https://unpkg.com/my-whole-website-umd"></script>
通过使用这种方法，人们可以节省成千上万的服务器维护费用。
为什么 UNPKG 仍然可以免费？
推荐指数
解决办法
查看次数
在浏览器中导入RxJS 6？
现在所有现代浏览器都支持javascript模块,我正在浏览器中尝试 import代码.我们可以npm从unpkg.com获取模块,并且我找到了jspm项目,它将npm模块包装成可以被浏览器使用的格式.
但我仍然遇到问题,尤其是RxJS.RxJS,从版本6开始,建议您导入构造函数和运算符,如下所示:
import { Observable, Subject, ReplaySubject, from, of, range } from 'rxjs';
import { map, filter, switchMap } from 'rxjs/operators';
但是,如果我尝试在浏览器中执行以下操作:
import { Observable, Subject, ReplaySubject, from, of, range } from 'https://dev.jspm.io/rxjs@6';
import { map, filter, switchMap } from 'https://dev.jspm.io/rxjs@6/operators';
我在这些方面遇到错误:
未捕获的SyntaxError:请求的模块" https://dev.jspm.io/rxjs@6/operators "未提供名为"map"的导出
我可以通过导入整个rxjs模块并弄清楚我需要什么来解决它,就像我使用CDN一样:
import rxjs from 'https://dev.jspm.io/rxjs@6';
const { Observable } = rxjs;
import operators from 'https://dev.jspm.io/rxjs@6/operators';
const { …推荐指数
解决办法
查看次数
无法从unpkg检索react-dom.development.js
我正在学习ReactJS并尝试在https://raw.githubusercontent.com/kirupa/kirupa/master/reactjs/helloworld_batman.htm上运行代码（这来自https://www.kirupa.com/上的说明react / building_your_first_react_app.htm）。
使用Chrome，永远不会显示“蝙蝠侠”，Chrome开发者工具会记录以下错误：
在' https://unpkg.com/react-dom@16.7.0/umd/react-dom.development.js '（从' https://unpkg.com/react-dom@16/umd重定向）访问脚本来自源'null'的/react-dom.development.js '）已被CORS策略阻止：所请求的资源上没有'Access-Control-Allow-Origin'标头。
当然，当直接请求react-dom.development.js时，Network选项卡显示标头丢失。
其他注意事项：
- 直接请求react.development.js时存在标头
- https://reactjs.org/docs/cdn-links.html上的说明显示了以这种方式从unpkg检索文件
- 在IE 11中不会发生此问题
我究竟做错了什么？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>React! React! React!</title>
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
<style>
#container {
padding: 50px;
background-color: #EEE;
}
#container h1 {
font-size: 144px;
font-family: sans-serif;
color: #0080a8;
}
</style>
</head>
<body>
<div id="container"></div>
<script type="text/babel">
var destination = document.querySelector("#container");
ReactDOM.render(React.createElement(
"h1",
null,
"Batman"
), destination);
</script>
</body> …推荐指数
解决办法
查看次数
如何在我的 Nodejs 项目中使用 unpkg url？
是否可以在我的 Nodejs 项目中使用 unpkg.com 网址？
我有一个项目设置使用nodejs https 来获取url 并且它可以工作，但我不确定如何或是否可能在我的nodejs 项目中使用它，就像我们使用常规安装的npm 包一样。
const https = require('https');
const url = 'https://unpkg.com/@tensorflow-models/speech-commands@0.3.3/dist/speech-commands.min.js';
那么我需要在这里使用它：
async function app() {
https.get(url, (res) => {
const statusCode = res.statusCode;
if (statusCode != 200) console.error(`Error ${statusCode}: ${res.statusMessage} ${url}.`);
else console.log('Success');
});
recognizer = speechCommands.create('BROWSER_FFT');
await recognizer.ensureModelLoaded();
predictWord();
};
响应成功返回，但我最终需要通过该 url 使用该包。我希望能够speechCommands用resunpkg.com 中的实例替换该实例。这可能吗？我尝试这样做的原因是，当我使用 npm 包时，我收到一个 fetch undefined 错误，并且由于这个包相当新，因此他们的存储库中没有问题部分设置可供询问。
推荐指数
解决办法
查看次数
如何从 unpkg.com 下载内容
Swiperjs 有这个链接： https: //unpkg.com/swiper/在本地使用他们的 swiper。但如何下载该页面的内容呢？
我希望在本地拥有该网站的内容。当我点击该链接时，我看到了包的内容，但没有下载链接。当我在浏览器中单击“保存网站”时，它仅下载一些 .js 文件。
不，伙计们。严重地。我怎么做？
我在该页面上找到了这个： https: //swiperjs.com/get-started
推荐指数
解决办法
查看次数
链接不再工作：例如 https://unpkg.com/vue@3.2.30/dist/vue.min.js
unpkg 的 CDN 链接不再工作。其他旧版本也不起作用。
https://unpkg.com/vue@3.2.30/dist/vue.min.js
我可以使用哪个链接代替？
谢谢
<script src="https://unpkg.com/vue@3.2.30/dist/vue.global.prod.js"></script>
<!-- <script src="//unpkg.com/vue@latest/dist/vue.min.js"></script> -->
<script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.min.js"></script>
<script src="https://unpkg.com/vue-router"></script>
<script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue-icons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
这些是我一直有效的加载来源。我该如何更换它们？
推荐指数
解决办法
查看次数
React JS min 脚本链接不起作用
使用IntelliJ Idea并创建一个index.htm文件
\n\n我只是想包含以下链接并在服务器端运行代码
\n屏幕上没有呈现任何内容：
<html >\n<head>\n <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>\n <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>\n\n <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>\n\n <title>Live Link</title>\n</head>\n<body>\n\n <div id="Output"></div>\n\n <script type="text/babel">\n ReactDOM.render(<h1>Hello Human</h1>, window.document.getElementById(\'Output\'));\n </script>\n</body>\n</html>\n此旧版本链接有效，但新版本链接无效。
\n\n\n\n\n\n\nConsole.log 中出现以下错误：
\n
babel.min.js:5 Uncaught SyntaxError: Invalid regular expression: Range out of order in character class\n at new RegExp (<anonymous>)\n at Object.<anonymous> (babel.min.js:5)\n at t (babel.min.js:1)\n at Object.t.__esModule (babel.min.js:19)\n at t (babel.min.js:1)\n at Object.<anonymous> (babel.min.js:2)\n at t (babel.min.js:1)\n at Object.e.exports (babel.min.js:1)\n at t (babel.min.js:1)\n at Object.e.exports.version (babel.min.js:1)\n(anonymous) …推荐指数
解决办法
查看次数