在我使用“ prod”标志进行构建后,Angular应用程序不再正常工作

时间:2019-03-13 21:14:27

标签: angular amazon-web-services npm web-applications aws-amplify

我正在运行Angular7。我的production构建设置包含键optimization=truebuildOptimizer=true。我将在底部的production文件中包含完整的angular.json配置部分的一部分。

我正在AWS Amplify上运行自动化构建。我还将在底部包括构建配置,但实际上它运行npm run build --prod

问题在于,构建成功后,我可以导航到我的Web应用程序,并且仍然看到所有不合法的源代码(通过转到Chrome开发者控制台并查看webpack目录的内容)。无法查明我做错了什么。

angular.json

"production": {
  "fileReplacements": [
    {
      "replace": "src/environments/environment.ts",
      "with": "src/environments/environment.prod.ts"
    }
  ],
  "optimization": true,
  "outputHashing": "all",
  "sourceMap": false,
  "extractCss": true,
  "namedChunks": false,
  "aot": true,
  "extractLicenses": true,
  "vendorChunk": false,
  "buildOptimizer": true,
  "budgets": [
    {
      "type": "initial",
      "maximumWarning": "2mb",
      "maximumError": "5mb"
    }
  ],
  "serviceWorker": true
}

构建脚本:

version: 0.1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run build --prod
  artifacts:
    baseDirectory: dist/myprojectname
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

2 个答案:

答案 0 :(得分:1)

为什么不使用Angular-CLI?

只需命令

  

ng build --prod

我认为您的'npm run build --prod'是自定义命令。 因此,prod标志未定义。不是吗?

答案 1 :(得分:1)

如果您使用的是webpack,请尝试使用devtool选项devtool: "hidden-source-map"作为解决方法。