Question

目前,Im正在将我的 app从v12升至v13,并注意到这一警告:

Option “deployUrl” is deprecated: 采用“基准Href”办法,“APP_BASE_HREF” DI aken 或两者结合。详情见https://angular.io/guide/dplo#the-deploy-url.

在挖掘后,没有哪一个基地。 Href 或PAS_BASE_REF 备选办法确实为我所设立的机构工作,因此,我很想知道,我是否错误地使用这些办法,或者是否有良好办法来取代这些办法。


这里是一只神.的雕像。 json:
    "dashboard": {
      "projectType": "application",
      "root": "apps/dashboard",
      "sourceRoot": "apps/dashboard/src",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "allowedCommonJsDependencies": [],
            "outputPath": "../dist/dashboard/",
            "deployUrl": "/dist/dashboard/",
            "index": "apps/dashboard/src/index.html",
            "main": "apps/dashboard/src/main.ts",
            "tsConfig": "apps/dashboard/tsconfig.app.json",
            "polyfills": "apps/dashboard/src/polyfills.ts",
            "styles": [
              "apps/dashboard/src/styles.scss"
            ],
            "scripts": [],
            "stylePreprocessorOptions": {
              "includePaths": [
                "libs/assets/styles"
              ]
            },
            "aot": false,
            "vendorChunk": true,
            "extractLicenses": false,
            "buildOptimizer": false,
            "sourceMap": true,
            "optimization": false,
            "namedChunks": true
          },
          "configurations": {
            "production": {
              "aot": true,
              "buildOptimizer": true,
              "extractLicenses": true,
              "fileReplacements": [
                {
                  "replace": "apps/dashboard/src/environments/environment.ts",
                  "with": "apps/dashboard/src/environments/environment.prod.ts"
                }
              ],
              "namedChunks": false,
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "vendorChunk": false
            },
            "es5": {
              "tsConfig": "apps/dashboard/tsconfig.es5.json"
            }
          },
          "defaultConfiguration": ""
        }
      }
    }

Snippet of routing file:
export const DashboardRoutes: Routes = [
    { path:   , pathMatch:  full , redirectTo:  /dashboard  },
    {
        path:  dashboard ,
        data: {
            label:  Dashboard ,
            appBase: true
        },
        children: [
            // this is a child so we can load the component in same router-outlet
            {
                path:   ,
                loadChildren: () => import( ./dashboard/dashboard.module ).then(m => m.DashboardModule),
                data: {
                    authorizedRoles: [ member ],
                }
            },
            // ...other children
        ]
    }
]

我试图将部署的Url改为基地Href,而这种工程、种类——将主页从<条码>改为“当地东道/dash板改为<条码>。 (明显不正确)和仅仅将空洞或“/”装上正确(如上)的 app/薄板。

值得注意的是,我的指数.html确实使用了<代码><base href=”/“>和PAS_BASE_HREF在评估模块提供者中并非凌驾于一切。

Answer 1

最终找到一些东西以取代:

Replaced "deployUrl" with "baseHref" in angular.json
Added the APP_BASE_HREF override in app.module
- i.e { provide: APP_BASE_HREF, useValue: / }
Replaced any hrefs in index.html that referenced the dist (output) folder
- e.g replaced dist/assets/{some_asset} with ../assets/{some_asset }
index.html still uses <base href="/">

Answer 2

这是安热13+的问题。

Found a solution here: https://github.com/angular/angular-cli/issues/22113#issuecomment-1004279867

你应该把以下守则放在你的主要位置。卷宗:

declare var  __webpack_public_path__: string;
__webpack_public_path__ =  valueFormerlyAssignedUsing_deployUrl ;

替换 ValueFormerlyAssignUsing_deployUrl,途径是翻翻一番,内有chu。

Answer 3

我目前的“安热”模式是14个,因为安热特13个被搁置的乌拉尔部署。

如果你使用CDN海滩,但你在云层服务器或云层功能等不同领域 app,就会造成麻烦。

here is the solution step by step:

删除 Url, no need to change it to base 否则,我们就不这样做。
以替换纸面文件替换纸浆。 j)

const replace = require( replace-in-file );

const prefix =  https://your-cdn.com/assets ;

const action2options = {
  files: path.join(process.cwd(),  /dist/browser/index.html ),
  from: [/<script src="(.*?)"/g],
  to: [`<script src="${prefix}$1"`],
};


replace(action2options)
  .then(results => {
    // console.log( Replacement results: , results);
  })
  .catch(error => {
    console.error( Error occurred: , error);
  });

load the chunk using your assets CDN by add this line to main.ts (if use universal, add it to main.server.ts too:

// main.ts add it
// main.server.ts add it too if use universal
// https://github.com/angular/angular-cli/issues/22113#issuecomment-1004279867
declare var __webpack_public_path__: string;
__webpack_public_path__ =  https://your-cdn.com/assets ;

如果您需要环境方面的改变联系,则利用这一联系来发现:

// angular.json => add to build -> scripts file

            {
                "input": "src/environments/replacer-build.js",
                "inject": false,
                "bundleName": "replacer-build.development"
              }

// update to production build too:
  "configurations": {
            "production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],

之后,你可以在替代档案中发现。 j:

const fs = require( fs );

const files = fs.readdirSync(path.join(process.cwd(),  /dist/browser )).filter(file => {
  return file.match(/^replacer-build.(development|production|staging).js$/);
});

let env =   ;
let assetUrl =   ;
if (files.length > 0) {
  const filename = files[0];
  if (filename.includes( development )) {
    env =  development ;
    assetUrl =  http://localhost:4200/ ;
  else if (filename.includes( production )) {
    env =  production ;
    assetUrl =  https://your-cdn.com/assets ;
  }
}


console.log(`The current environment is ${env} and assetURL replace to:`, assetUrl);

之后,你可以把你的系统装上服务器,而是由CDN公司装上。

Answer 4

在“蜂窝”第17号之后,用蒸ite和浮.取代网络包装。不可能使用web Pack_public_path?

友情链接