Как импортировать файл JSON в библиотеку Angular?

У меня возникли проблемы с импортом файла JSON в файл среды в библиотеке Angular 7. Мой файл environment.ts выглядит так:

import firebase from './firebase.json';

export const environment = {
  production: false,
  firebase,
};

И firebase.json:

{
  "apiKey": "",
  "authDomain": "",
  "databaseURL": "",
  "projectId": "",
  "storageBucket": "",
  "messagingSenderId": ""
}

Но, к сожалению, при запуске ng build происходит сбой:

> [email protected] build <path-to-project>/sdk
> ng build sdk

Building Angular Package
Building entry point 'sdk'
Compiling TypeScript sources through ngc
Bundling to FESM2015

BUILD ERROR
Unexpected token / in JSON at position 0
SyntaxError: Unexpected token / in JSON at position 0
    at JSON.parse (<anonymous>)
    at Object.transform (<path-to-project>/sdk/node_modules/rollup-plugin-json/dist/rollup-plugin-json.cjs.js:18:20)
    at <path-to-project>/sdk/node_modules/rollup/dist/rollup.js:20962:25

Unexpected token / in JSON at position 0
SyntaxError: Unexpected token / in JSON at position 0
    at JSON.parse (<anonymous>)
    at Object.transform (<path-to-project>/sdk/node_modules/rollup-plugin-json/dist/rollup-plugin-json.cjs.js:18:20)
    at <path-to-project>/sdk/node_modules/rollup/dist/rollup.js:20962:25
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `ng build sdk`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     xxx/.npm/_logs/2019-04-10T13_40_47_486Z-debug.log

Я уже пробовал:

1) Добавление к tsconfig.json

"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"noImplicitAny": false,

2) Добавление typings.d.ts с

declare module '*.json' {
  const value: any;
  export default value;
}

3) Замена import на require

Но пока не повезло.

Мои devDependencies включают:

"@angular-devkit/build-ng-packagr": "^0.13.8",
"@angular/cli": "~7.3.6",
"@angular/common": "~7.2.0",
"@angular/compiler": "^7.2.12",
"@angular/compiler-cli": "^7.2.12",
...

json angular rollupjs ng-packagr
person Gerda    schedule 10.04.2019    source источник
comment
Попробуйте создать статический файл JSON и импортировать его, возможно, проблема связана с вашим файлом или форматом JSON.   -  person sabithpocker    schedule 10.04.2019
comment
Можете ли вы также добавить firebase.json?   -  person sabithpocker    schedule 10.04.2019
comment
Добавлен firebase.json. В моем приложении он работал нормально, но я хотел бы импортировать его в SDK библиотеки angular, и здесь он не работает.   -  person Gerda    schedule 10.04.2019
comment
Возможный дубликат Angular 6 - загрузить JSON из локального   -  person Kamil Naja    schedule 10.04.2019
comment
К сожалению, ни один из ответов не решает мою проблему (которая кажется другой).   -  person Gerda    schedule 10.04.2019
comment
Ваша установка выглядит нормально, интересно, связана ли проблема с перезаписью файла среды? Можете ли вы попробовать импортировать json и зарегистрировать его в другом файле, а не в среде?   -  person sabithpocker    schedule 10.04.2019
comment
Поэтому я попытался импортировать файл JSON в один из моих сервисов в библиотеке. Сборка по-прежнему не работает. Я также пытался сделать файл полностью пустым, все равно то же самое...   -  person Gerda    schedule 11.04.2019
comment
Можно проверить проблемы в rollup-plugin-json, например это один. Если ничего не помогает открыть проблему с ними, они могут помочь.   -  person sabithpocker    schedule 11.04.2019

Ответы (1)


arrow_upward
11
arrow_downward

После долгих мучений мы нашли это решение здесь.

В основном это то, что вы сделали с первой попытки, но вам нужно добавить еще один вариант.

"resolveJsonModule": true,  
"esModuleInterop": true,
"allowSyntheticDefaultImports": true

Кроме того:

"annotateForClosureCompiler": false

Примечание: для последнего реквизита это тот же файл, но вместо того, чтобы добавлять его в compilerOptions, добавьте его в angularCompilerOptions.

person Radek Konrad Furmański    schedule 25.04.2019
comment
Нет, все еще есть токен Unexpected / в JSON в позиции 0 - person Jnr; 22.01.2020
comment
Я добавляю точно такую ​​же проблему и отключаю annotateForClosureCompiler на angularComplierOptions, чтобы исправить это. - person Victor Dias; 04.06.2020