ng-i18next 项目使用教程

ng-i18next 项目使用教程

ng-i18nexttranslation for AngularJS using i18next项目地址:https://gitcode.com/gh_mirrors/ng/ng-i18next

1. 项目的目录结构及介绍

ng-i18next/
├── src/
│   ├── provider.ts
│   └── ...
├── examples/
│   └── ...
├── gulpfile.js
├── package.json
├── bower.json
├── typings.json
├── README.md
└── ...

• src/: 包含项目的核心源代码，如 provider.ts。
• examples/: 包含示例代码，可以通过 gulp serve 运行。
• gulpfile.js: Gulp 构建脚本，用于构建和测试项目。
• package.json: npm 包配置文件，包含项目的依赖和脚本。
• bower.json: Bower 包配置文件，用于前端依赖管理。
• typings.json: TypeScript 类型定义文件。
• README.md: 项目说明文档。

2. 项目的启动文件介绍

项目的启动主要依赖于 AngularJS 和 i18next 库。以下是启动步骤：

1. 加载必要的库：

   <script src="path/to/angular.js"></script>
   <script src="path/to/angular-sanitize.js"></script>
   <script src="path/to/i18next.js"></script>
   <script src="path/to/i18next-xhr-backend.js"></script>
   <script src="path/to/ng-i18next.js"></script>
   

2. 配置 i18next：

   window.i18next.use(window.i18nextXHRBackend).init({
       debug: true,
       lng: 'de',
       fallbackLng: 'dev',
       backend: {
           loadPath: '/locales/{{lng}}/{{ns}}.json'
       },
       useCookie: false,
       useLocalStorage: false
   }, function(err, t) {
       console.log('resources loaded');
   });
   

3. 启动 AngularJS 应用：

   angular.module('myApp', ['ngSanitize', 'ngI18next']);
   

3. 项目的配置文件介绍

package.json

{
  "name": "ng-i18next",
  "version": "1.0.0",
  "description": "translation for AngularJS using i18next",
  "main": "src/provider.ts",
  "scripts": {
    "build": "gulp build",
    "test": "gulp test"
  },
  "dependencies": {
    "angular": "^1.5.0",
    "angular-sanitize": "^1.5.0",
    "i18next": "^19.0.0",
    "i18next-xhr-backend": "^3.0.0"
  },
  "devDependencies": {
    "gulp": "^4.0.0",
    "typescript": "^4.0.0"
  }
}

• name: 项目名称。
• version: 项目版本。
• description: 项目描述。
• main: 主入口文件。
• scripts: 包含构建和测试的脚本。
• dependencies: 项目运行时的依赖。
• devDependencies: 开发时的依赖。

bower.json

{
  "name": "ng-i18next",
  "version": "1.0.0",
  "description": "translation for AngularJS using i18next",
  "main": "src/provider.ts",
  "dependencies": {
    "angular": "^1.5.0",
    "angular-sanitize": "^1.5.0",
    "i18next": "^19.0.0",
    "i18next-xhr-backend": "^3.0.0"
  }
}

• name: 项目名称。
• version: 项目版本。
• description: 项目描述。
• main: 主入口文件。
• dependencies: 项目运行时的依赖。

gulpfile.js

var gulp = require('gulp');
var typescript = require('gulp-typescript');

gulp.task('build', function() {
    return gulp.src('src/**/*.ts')
        .pipe(typescript({
            target: 'ES5',
            module: 'commonjs'
        }))
        .pipe(gulp.dest('dist'));
});

gulp.task('test', function() {
    // 测试任务
});

• build: 构建任务，将 TypeScript 编译为 JavaScript。
• test: 测试任务。

以上是 ng-i18next 项目的基本使用教程，涵盖了项目的目录结构、启动文件和配置文件的介绍。希望对您有所帮助！

ng-i18nexttranslation for AngularJS using i18next项目地址:https://gitcode.com/gh_mirrors/ng/ng-i18next