e6でjson応答をエクスポートする

Question

responseをフェッチからエクスポートして、ビルド中のアプリケーションでグローバルに使用しようとしていますが、正しく機能するようにはできません。それは私がエクスポートしている行の構文errorだと言います。

コード：

const URL = './dist/json/settings.json'; 
let ENV = null; 

fetch(URL).then(res => res.json()) 
.then(data => { 
    // console.log(data); 
    ENV = data; 
}) 
.catch(e => { 
    console.log(e); 
}) 

export ENV; 

私はJSONにアクセスしたいモジュール

import AbstractModule from './AbstractModule' 

class SummaryModule extends AbstractModule { 
    constructor() { 
    super() 
    this.init() 
    } 

    init() { 

    } 
} 

export default SummaryModule 

Answer 1

だけ宣言にexportを追加します。

const URL = './dist/json/settings.json'; 
export let ENV = null; // <==== 

fetch(URL).then(res => res.json()) 
.then(data => { 
    // console.log(data); 
    ENV = data; 
}) 
.catch(e => { 
    console.log(e); 
}); 

それとも本当にあなたの場合最後に輸出をしたい（それが必要ない）使用することができます：

export { ENV }; 

---

しかしを、それが記入されています前に、他のモジュールがエクスポートされたバインディングを使用するかもしれないので、あなたはそのようではなく、値そのものの価値の約束をエクスポート検討するかもしれません彼らは、彼らが到着するのを待つ価値を保証するためにthen（またはawait）を使用することができます。私たちはどのミリアンペア元の約束を回しているように、私はcatchハンドラを移動した

const URL = './dist/json/settings.json'; 
export const envPromise = fetch(URL).then(res => res.json()); 
envPromise.catch(e => { 
    console.log(e); 
}); 

注意y拒否ではなく、によって作成されたもので、拒否をundefinedで解決に変換します。つまり、このモジュールを使用しているモジュールはenvPromiseであり、拒絶反応を見てそれに対応することもできます。代わりに、それをやり直す：

const URL = './dist/json/settings.json'; 
export const envPromise = fetch(URL) 
    .then(res => res.json()) 
    .catch(e => { 
     console.log(e); 
     throw e; 
    }); 

catchを完全にオフにしておくことができます。そうした場合、モジュールの少なくとも1人の消費者がcatchを持っている必要があります。フェッチが失敗した場合は、「処理されなかった拒否エラー」が発生します。

あなたは、インポートし、このようにそれを使用したい：

import { envPromise } from './themodule.js'; 

...、どこであなたがそれを使用したい：

envPromise.then(env => { 
    // ...use env... 
}); 

あなたはまた、代わりにデフォルトのエクスポート作ることができます：

export default fetch(/*...*/); 

と変更インポート：

import anyNameIWantHere from './themodule.js'; 
// ... 
anyNameIWantHere.then(env => { 
    // ...use env... 
});