Angular项目打包发布到IIS,打开网站无法加载出内容的问题

时间:2024-03-22 21:46:02
首先angular项目打包可以执行cmd命令行【ng build --prod --aot】 ,成功后会在根目录下生成dist文件夹,我们只需将该文件夹拷贝到服务器,然后IIS上添加站点指向对应的文件夹即可;一般情况下都是能正常访问网站的,以至于网站内容无法显示出来则是浏览器兼容问题,360浏览器就有可能打开无内容,谷歌和火狐应该是可以的,那么在发布前我们需要找到项目根目录下的polyfills.ts文件,将里面的注释全部取消掉;如下图:
Angular项目打包发布到IIS,打开网站无法加载出内容的问题
注意这里面的提示,添加改引用 需要加载该模块,我们就按上面的所说 cd到你的项目 然后npm注入依赖即可;
完成后 再执行打包命令行【ng build --prod --aot】,然后将生成的文件覆盖服务器上的文件即可;
注:

项目发布后需要在根目录下添加web.config文件

然后将一下代码复制进去即可:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <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" />
          </conditions>
          <action type="Rewrite" url="/" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>

</configuration>

项目在发布后请检查文件夹的权限以及防火墙,每个细节都关系到网站是否能够正常访问;