Docker+Nginx部署Angular國際化i18n

在Angular專案中新增default.conf檔案

default.conf
為了支援區域網，增加一個域名，即本地的區域網ip地址。

server {
    listen       80;
    server_name  localhost;
    server_name  192.168.2.172;

    location / {
        root   /usr/share/nginx/html;

        location ~* /([a-z\-)]+)/ {
            try_files $uri /$1/index.html /index.html;
        }

        try_files $uri $uri/index.html /index.html;
    }
}
 

package.json

...
"build-i18n:zh": "ng build --prod --outputPath=dist/zh --i18nFile=src/locale/messages.zh.xlf --i18nFormat=xlf --locale=zh-Hans",
"build-i18n:en": "ng build --prod --outputPath=dist/en --i18nFile=src/locale/messages.en.xlf --i18nFormat=xlf --locale=en-US",
"build-i18n": "npm run build-i18n:zh; npm run build-i18n:en",
"start:docker": "docker run --rm --name i18n -v $PWD/dist:/usr/share/nginx/html:ro -v $PWD/default.conf:/etc/nginx/conf.d/default.conf:ro -p 8090:80 -d nginx",
"restart:docker": "docker restart i18n"
...
 

–rm：容器停止執行後，自動刪除容器檔案

• 編譯翻譯檔案
  在dist目錄下生成zh和en兩個資料夾。

npm run build-i18n

• 啟動臨時容器
  這個容器使用stop命令停止的時候，就消失了，如果想要一直存在需要將–rm引數去掉。

npm run start:docker
npm run restart:docker # 需要重新啟動生效

開啟瀏覽器輸入 http://localhost:8090/zh 訪問英文網站，http://localhost:8090/en 訪問中文網站。