我想使用aframe
配置作为单独的包将<head>
标记导入angular.json
。
在angular.json
内部,我有要从node_modules导入的脚本:
"scripts": [
"node_modules/aframe/dist/aframe-v1.0.0.min.js"
]
这是捆绑并导入到html主体的底部。
<body>
<app-root></app-root>
...
<script src="scripts.js" ...>
</body>
这是不理想的,因为库明确要求我导入<head>
。
此外,我想将其作为单独的捆绑软件导入:
"scripts": [
{ "input": "node_modules/aframe/dist/aframe-v1.0.0.min.js", "bundleName": "aframe-v1.0.0.min" }
]
您可以使用服务将其注入头部。
您可以像这样将脚本引用添加到angular.json,例如include jquery library,并且您必须将inject设置为false,这样捆绑包将随构建文件一起提供,但不会注入yo index.htm,现在您可以将脚本标签添加到标题标签中
"scripts": [
{
"input": "node_modules/jquery/dist/jquery.min.js",
"inject": false,
"bundleName": "jquery"
}
]
更新index.html并在标头中包含脚本时代
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Portfolio</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<script src="jquery.js"></script> <!-- 👈 -->
</head>
<body>
<app-root></app-root>
</body>
</html>