【发布时间】：2018-01-19 23:05:03
【问题描述】：
我想在 IntelliJ 中创建一个使用 Angular UI 的 Play 应用程序。这已经完成（https://github.com/lbialy/play-ng2-webpack2）所以我想这是可能的。
首先我在 web 文件夹中使用 IntelliJ 创建了 Play2 应用程序
然后我在ui 文件夹中的web 文件夹中使用Angular CLI 创建了一个Angular 应用程序
然后我在ui 文件夹中运行ng build。这创建了一个dist 文件夹
我将dist文件夹的内容复制到web/public/ui
然后我将index.scala.html 更改为跟随以使用Angular UI。
@(message: String)
<!DOCTYPE html>
<html>
<head>
<title>@message</title>
<link rel="stylesheet" media="screen" href="@routes.Assets.versioned("stylesheets/common/css-reset.css")">
<link rel="stylesheet" media="screen" href="@routes.Assets.versioned("stylesheets/common/common-styles.css")">
<link rel="stylesheet" media="screen" href="@routes.Assets.versioned("stylesheets/common/vendor/bootstrap/bootstrap.css")">
</head>
<body class="body-common-styles">
<div class="css-grid-container-common-styles">
<app-root></app-root>
</div>
<script type="text/javascript" src="@routes.Assets.versioned("ui/inline.bundle.js")"></script>
<script type="text/javascript" src="@routes.Assets.versioned("ui/polyfills.bundle.js")"></script>
<script type="text/javascript" src="@routes.Assets.versioned("ui/styles.bundle.js")"></script>
<script type="text/javascript" src="@routes.Assets.versioned("ui/vendor.bundle.js")"></script>
<script type="text/javascript" src="@routes.Assets.versioned("ui/main.bundle.js")"></script>
<script src="@routes.Assets.versioned("javascripts/common/vendor/jquery/jquery-3.2.1.js")" type="text/javascript"></script>
<script src="@routes.Assets.versioned("javascripts/common/vendor/bootstrap/bootstrap.js")" type="text/javascript"></script>
</body>
</html>
但我在localhost:9000 看不到app-root UI（Angular CLI 创建的默认 UI）。我看到了我的 css 创建的蓝色背景，但没有看到 Angular 的东西。
如果我在web/ui 中运行ng serve，那么我会在localhost:4200 看到Angular 的东西。
我做错了什么？我想如果js 文件在公共文件夹中可用，那么我应该能够在 index.scala.html 中访问它们（我想我可以这样做，因为我在浏览器开发者控制台中看不到任何 404 消息）。
更新
虽然我没有看到 404 错误，但我在开发者控制台中看到了以下错误，但我不确定它们是否与 Angular 相关（有很多 font 错误！）。
addStyles.js:115 Refused to apply inline style because it violates the following Content Security Policy directive: "default-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.
insertStyleElement @ addStyles.js:115
createStyleElement @ addStyles.js:132
addStyle @ addStyles.js:165
addStylesToDom @ addStyles.js:77
webpackJsonp.../../../../style-loader/addStyles.js.module.exports @ addStyles.js:37
../../../../../src/styles.css @ styles.css?043a:7
__webpack_require__ @ bootstrap 339cf76f3ca05ce50b1e:54
2 @ addStyles.js:246
__webpack_require__ @ bootstrap 339cf76f3ca05ce50b1e:54
webpackJsonpCallback @ bootstrap 339cf76f3ca05ce50b1e:25
(anonymous) @ styles.bundle.js:1
addStyles.js:225 Refused to apply inline style because it violates the following Content Security Policy directive: "default-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-xylbkVtqJQuRDTD/O50Zkbb0PJR006+vxsulnu5EOD4='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.
applyToTag @ addStyles.js:225
addStyle @ addStyles.js:172
addStylesToDom @ addStyles.js:77
webpackJsonp.../../../../style-loader/addStyles.js.module.exports @ addStyles.js:37
../../../../../src/styles.css @ styles.css?043a:7
__webpack_require__ @ bootstrap 339cf76f3ca05ce50b1e:54
2 @ addStyles.js:246
__webpack_require__ @ bootstrap 339cf76f3ca05ce50b1e:54
webpackJsonpCallback @ bootstrap 339cf76f3ca05ce50b1e:25
(anonymous) @ styles.bundle.js:1
localhost/:1 Refused to load the font '
localhost/:1 Refused to load the font 'data:font/woff;base64,d09GRgABAAAAAIw4ABEAAAABQcAAAQABAAAAAAAAAAAAAAAAAAAAAAAAAABHUE9TAAABgAAACU8AABMOD1XXMEdTVUIAAArQAAAAUwAAAHCOOI56T1MvMgAACyQAAABbAAAAYNrnrZBjbWFwAAALgAAAAIEAAAC0jBiQAGN2dCAAAAwEAAAAKgAAAC4HyBmgZnBnbQAADDAAAAOBAAAG5XJackBnYXNwAAAPtAAAAAwAAAAMAA0AGGdseWYAAA/AAABViQAAvQzAr6AGaGVhZAAAZUwAAAA2AAAANvzd8kdoaGVhAABlhAAAAB8AAAAkD/YHpGhtdHgAAGWkAAACFAAAA26BW0HVa2VybgAAZ7gAAB/3AABeRKoEucNsb2NhAACHsAAAAb4AAAG+1eip6m1heHAAAIlwAAAAIAAAACAByAf2bmFtZQAAiZAAAADEAAABYBoFNRJwb3N0AACKVAAAAZYAAAJBVvgNXnByZ...KKKqa4EkoqpbQyyiqnvAoqqqSyKqqqproaaqqltjrqqqe+BhpqpLEmmmqmuRZaaqW1Ntpqp70OOuqksy66BhE2m2Gms1Z5Z5ZF5ltrpy1BpHlemm65H35aaLU5Lnvru3V2+e2XPzbZ66br9ummuyV6uK2nG26574677nmvl0ceeGi/3r5Z6qnHnujjo8/m6qev/gYaYJANBhtqiGGGG2mEUUb7YIxxxhpvoglO2GiySaaY6pMvTnnmgIOee+OFQw475rgrjjjqqtnOOe9MEOWrCy4G0UFMEBvEBfFB+N9Y/EJ9fNhL8zINDBwNoLQLi2tpUT5XelFiWapecmJxKm9KZmpRanFmMZjHlZhcWgKR4E/OLEouzU3LSa0A8zmLMvPSIYpKMnNSIIoAYXqDQQAAuQgACABjILABI0QgsAMjcLAURSAgsChgZiCKVViwAiVhsAFFYyNisAIjRLMJCgMCK7MLEAMCK7MRFgMCK1myBCgGRVJEswsQBAIrAA==' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback.
compiler.js:34062 Uncaught EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "default-src 'self'".
at new Function (<anonymous>)
at evalExpression (compiler.js:34062)
at jitStatements (compiler.js:34080)
at JitCompiler.webpackJsonp.../../../compiler/esm5/compiler.js.JitCompiler._interpretOrJit (compiler.js:34663)
at JitCompiler.webpackJsonp.../../../compiler/esm5/compiler.js.JitCompiler._compileTemplate (compiler.js:34591)
at compiler.js:34490
at Set.forEach (<anonymous>)
at JitCompiler.webpackJsonp.../../../compiler/esm5/compiler.js.JitCompiler._compileComponents (compiler.js:34490)
at compiler.js:34360
at Object.then (compiler.js:474)
【问题讨论】：
-
检查控制台是否有错误并更新到帖子
-
添加了我在开发者控制台中看到的错误，但我不确定它们是否与 Angular 相关
-
我安装了 Augury 并在开发者控制台中注意到了这条消息 -
This application is not an Angular application. This application cannot be inspected using Augury.我想知道为什么当我在公共文件夹中复制了所有必需的“js”时这不是一个角度应用程序。我犯了什么错误？
标签： angular intellij-idea playframework-2.0