Angular:设置 baseHref 不会创建子文件夹 [英] Angular: setting baseHref does not create subfolders
问题描述
当你使用 --base-href "/some/path/" 运行 ng build 时，为什么 angular 没有根据路径创建子目录?当我在我的/dist/中启动 http 服务器时，我收到了诸如 GET/some/path/assets/images/image.png Not Found! 之类的错误.当您查看 /dist/ 时，问题很明显:直接只有 assets 文件夹，其他文件夹中没有.
When you run ng build with --base-href "/some/path/", why does angular not create subdirectories according to the path? When I start a http-server in my /dist/ I get errors like GET /some/path/assets/images/image.png Not Found! thrown in my face. when you look into /dist/, the problem is clear: there is only the assets folder directly, not inside other folders.
那么设置 baseHref 的正确方法是什么?
So what is the right way to set a baseHref?
我尝试实现的是从同一域提供不同版本的应用程序(具有不同的 i18n 语言环境)，但具有不同的 baseHref，例如 /EN/、/FR/ 等等.
What I try to accomplish is having different versions of the app (with different i18n locales) being served from the same domain but with a different baseHref, eg /EN/, /FR/ and so on.
推荐答案
我的应用程序使用 i18n 时遇到了同样的问题.首先:Angular 仍在开发中，所以例如 i18n 不能开箱即用，取决于你想做什么，这里是 GitHub 上的 i18n 路线图 #16477 也许还在第 5 版中，他们想要实现动态翻译，因此您不需要为每种语言使用不同的应用程序，但这是一个不同的问题；)
I had the same problem with my app that uses i18n. First of all: Angular is still beeing developed, so for example i18n doesnt work out of the box, depending on what you want to do here is a roadmap for i18n on GitHub #16477 maybe still in version 5 they want to implement dynamic translation so you won't need a different app for each language, but thats a different issue ;)
我想你正在寻找:
--output-path
使用此命令，您可以设置存储实际文件的路径(来自 角度维基)--base-href 仅在 index.html 中设置 href 属性，但由于您想为需要使用的文件设置路径 --output-path
with this command you set the path where your actual files will be stored (from Angular wiki)
--base-href only sets the href attribute in your index.html but since you want to set the path for the files you need to use --output-path
我不确定您是否还需要为您的应用设置 --deploy-url，无论如何 --deploy-url/en 创建以下 index.html:
I'm not sure if you also need to set --deploy-url for your apps, anyway --deploy-url /en creates the following index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Title</title>
<base href="/">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="icon" type="image/x-icon" href="assets/favicon_link_icon.png">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="/en/styles.xxx.bundle.css" rel="stylesheet"/>
</head>
<body>
<app-root></app-root>
<script type="text/javascript" src="/en/inline.xxx.bundle.js"></script>
<script type="text/javascript" src="/en/polyfills.xxx.bundle.js"></script>
<script type="text/javascript" src="/en/main.xxx.bundle.js"></script>
</body>
</html>
--output-path ./dist/en 使用几乎相同的 index.html 创建一个新文件夹 dist/en，只有src 路径缺少 /en/ 前缀
--output-path ./dist/en creates a new folder dist/en with almost the same index.html only the src path is missing the /en/ prefix
这篇关于Angular:设置 baseHref 不会创建子文件夹的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
