未捕获的语法错误:inline.bundle 中意外的令牌<.js:1 - Angular v4



部署到IIS后,我发现我的路由都不起作用,因此我研究了这个问题,然后发现了这个问题,其中说您必须向web.config添加重写,我做到了,路由现在正在工作。

以下是我的一些在开发模式下工作但在生产模式下工作的路线:

const appRoutes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'manage', component: ManageComponent },
  { path: 'manage/products', component: ProductComponent },
  { path: 'manage/products/:action/:id', component: ProductComponent },
  { path: 'manage/companies', component: CompanyComponent },
];  

我在web.config做了什么:

<system.webServer>
  <rewrite>
    <rules>
      <rule name="Angular Routes" stopProcessing="true">
        <match url=".*"/>
        <conditions logicalGrouping="MatchAll">
          <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true"/>
          <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true"/>
          <add input="{REQUEST_URI}" pattern="^/(api)" negate="true"/>
        </conditions>
        <action type="Rewrite" url="/"/>
      </rule>
    </rules>
  </rewrite>
</system.webServer>

那么实际问题是什么呢?当我刷新/重定向页面时出现问题。一个小时后,研究发现我用web.config写的规则总是返回index.html,这就是为什么我在以下文件中得到Uncaught SyntaxError: Unexpected token <

inline.bundle.js:1
polyfills.bundle.js:1
styles.bundle.js:1
vendor.bundle.js:1
main.bundle.js:1

你建议怎么解决这个问题?

更新:通过从路由中删除manage修复了没有参数的路由的问题,但包含参数的路由仍然存在问题。

有同样的问题。 通过将索引中的基本 href 标记更改为完全限定的基本 url .html来修复。

以前:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>MySubApp</title>
    <base href="/">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/x-icon" href="favicon.ico">

  </head>
  <body>
    <mu-root></mu-root>
  <script type="text/javascript" src="inline.bundle.js"></script><script type="text/javascript" src="polyfills.bundle.js"></script><script type="text/javascript" src="scripts.bundle.js"></script><script type="text/javascript" src="styles.bundle.js"></script><script type="text/javascript" src="vendor.bundle.js"></script><script type="text/javascript" src="main.bundle.js"></script></body>
</html>

后:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>MySubApp</title>
    <base href="http://MyUrl.com/MySubApp/">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/x-icon" href="favicon.ico">

  </head>
  <body>
    <mu-root></mu-root>
  <script type="text/javascript" src="inline.bundle.js"></script><script type="text/javascript" src="polyfills.bundle.js"></script><script type="text/javascript" src="scripts.bundle.js"></script><script type="text/javascript" src="styles.bundle.js"></script><script type="text/javascript" src="vendor.bundle.js"></script><script type="text/javascript" src="main.bundle.js"></script></body>
</html>

不是 100% 清楚为什么,但似乎 IIS 重写 urls 的方式改变了基本根的传递方式,这破坏了相对路径"/"base-href。

相关内容

最新更新