时间:2021-05-25
在模板html标签中增加i18n
使用ng命令产生xlf格式的message.xlf文件
$ ng xi18n --output-path src/i18n命令执行后,生成 src/i18n/messages.xlf 文件
<?xml version="1.0" encoding="UTF-8" ?><xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2"> <file source-language="en" datatype="plaintext" original="ng2.template"> <body> <trans-unit id="5816217f424111ae4c91dd72ee1db0ae252763b5" datatype="html"> <source>Hello World!</source> <target/> </trans-unit> </body> </file></xliff>复制message.xlf,message.en.xlf(英文版本) message.zh.xlf中文版本
<?xml version="1.0" encoding="UTF-8" ?><xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2"> <file source-language="en" datatype="plaintext" original="ng2.template"> <body> <trans-unit id="5816217f424111ae4c91dd72ee1db0ae252763b5" datatype="html"> <source>Hello World!</source> <target>Hello World!</target> </trans-unit> </body> </file></xliff>现在浏览,显示的是中文版本
$ for lang in en zh; do \ ng build --output-path=dist/$lang \ --aot \ -prod \ --bh /$lang/ \ --i18n-file=src/i18n/messages.$lang.xlf \ --i18n-format=xlf \ --locale=$lang; \ done这个命令执行完毕后,生成了en和zh两种语言版本。http://localhost:4200/en访问英文版本,http://localhost:4200/zh访问中文版本。--bh指定默认版本,http://localhost:4200访问时,跳转到默认版本。
修改package.json文件,加入脚本
{ [...] "scripts": { [...] "build-i18n": "for lang in en zh; do ng build --output-path=dist/$lang --aot -prod --bh /$lang/ --i18n-file=src/i18n/messages.$lang.xlf --i18n-format=xlf --locale=$lang; done" } [...]}这样就可以执行npm run build-i18n 命令,一次build多个语言版本了。
windows用户命令
> ng build --output-path=dist/zh --aot -prod --bh /zh/ --i18n-file=src/i18n/messages.zh.xlf --i18n-format=xlf --locale=zh> ng build --output-path=dist/en --aot -prod --bh /en/ --i18n-file=src/i18n/messages.en.xlf --i18n-format=xlf --locale=enpackage.json脚本
"scripts": { "build-i18n:es": "ng build --output-path=dist/zh --aot -prod --bh /zh/ --i18n-file=src/i18n/messages.zh.xlf --i18n-format=xlf --locale=zh", "build-i18n:en": "ng build --output-path=dist/en --aot -prod --bh /en/ --i18n-file=src/i18n/messages.en.xlf --i18n-format=xlf --locale=en", "build-i18n": "npm run build-i18n:en ; npm run build-i18n:zh" }以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
vue中使用vue-i18n兼容多国语言1.安装:npminstallvue-i18n--save-dev2.在main.js文件中引入:importVueI1
两年前,写过一篇使用rollup来为生产环境编译Angular2应用的文章,因为当时还没有angular-cli项目。而如今Angular已经到了7.x版本,对
详解Angular-cli生成组件修改css成less或sass的实例使用cli命令生成组件:nggeneratecomponent组件名生成出来的组件文件有:
Angular-CLI说到cli大家不陌生,每出一个框架都会有对应的cli,俗称脚手架。angular2本身提供了起步项目angular2-quickstart
最近在学习angular(AngularJS2),根据教程使用angular-cli新建项目,然而在添加JQuery和Bootstrap第三方库时遇到了问题..