Question

我有检索翻译文件的加载器：

export function translateLoaderFactory(http: HttpClient) {
    return new TranslateHttpLoader(http, "/i18n/", ".json");
};

我的结构项目是：

/src/app/app.module.js
/src/i18n/en.json

启动应用程序时，我收到以下消息：

ERROR {
JS:   "headers": {
JS:     "normalizedNames": {},
JS:     "lazyUpdate": null,
JS:     "headers": {}
JS:   },
JS:   "status": 404,
JS:   "statusText": "ERROR",
JS:   "url": "/data/data/org.nativescript.App/files/app/i18n/en.json",
JS:   "ok": false,
JS:   "name": "HttpErrorResponse",
JS:   "message": "Http failure response for /data/data/org.nativescript.App/files/app/i18n/en.json: 404 ERROR",
JS:   "error": "Not Found"
JS: }

编译后无法通过路径/data/data/org.nativescript.App/files/app/i18n/en.json查找文件。

我应该在哪里设置路径设置？

我的tsConfig：

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "noEmitHelpers": true,
        "noEmitOnError": true,
        "lib": [
            "es6",
            "dom",
            "es2015.iterable"
        ],
        "baseUrl": ".",
        "paths": {
            "~/*": [
                "src/*"
            ]
        }
    },
    "exclude": [
        "node_modules",
        "platforms"
    ]
}

我尝试过：

return new TranslateHttpLoader(http, "../i18n/", ".json");
return new TranslateHttpLoader(http, "./../i18n/", ".json");
return new TranslateHttpLoader(http, "i18n/", ".json");

现在我收到此错误：

Angular is running in the development mode. Call enableProdMode() to enable the production mode.
JS: ERROR {
JS:   "headers": {
JS:     "normalizedNames": {},
JS:     "lazyUpdate": null,
JS:     "headers": {}
JS:   },
JS:   "status": 0,
JS:   "statusText": "Unknown Error",
JS:   "url": "./assets/i18n/en.json",
JS:   "ok": false,
JS:   "name": "HttpErrorResponse",
JS:   "message": "Http failure response for ./assets/i18n/en.json: 0 Unknown Error",
JS:   "error": {
JS:     "originalStack": "Error: java.net.MalformedURLException: no protocol: ./assets/i18n/en.json\n    at new c (file:///data/data/org.nativescript.App/files/app/vendor.js:1:1700209)\n    at file:///data/data/org.nativescript.App/files/app/vendor.js:1:1565607\n    at Object.onComplete (file:///data/data/org.nativescript.App/files/app/vendor.js:1:1566741)",
JS:     "zoneAwareStack": "Error: java.net.MalformedURLException: no protocol: ./assets/i18n/en.json\n    at new c (file:///data/data/org.nativescript.App/files/app/vendor.js:1:1700209)\n    at file:///data/data/org.nativescript.App/files/app/vendor.js:1:1565607\n    at Object.onComplete (file:///data/data/org.nativescript.App/files/app/vendor.js:1:1...

Answer 1

您必须配置CopyWebpackPlugin以便在编译时将文件包含到包中

webpack.config.js

        // Copy assets to out dir. Add your own globs as needed.
        new CopyWebpackPlugin(
            [
                { from: { glob: "assets/**" } },
                { from: { glob: "fonts/**" } },
                { from: { glob: "i18n/*.json" } },
                { from: { glob: "**/*.jpg" } },
                { from: { glob: "**/*.png" } },
            ],
            { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] },
        ),

此{ from: { glob: "i18n/*.json" } },确保将所有i18n JSON文件都复制到分发包中。

如何在NativeScript中设置资产的正确路径？

1 个答案: