為什么我不能從另一個文件訪問變量？

Question

在我的項目中，我使用 WebPackEncore 來管理我的庫。

在一個文件中，我重新組合了訪問 API 所需的所有密鑰，它被稱為keys.js ：

const keys = {
    //> Algolia/places API
    ALGOLIA_PLACE_APP_ID: "appKey",
    ALGOLIA_PLACE_API_ID: "APIkey",
    //###< Algolia/places API

    //> MapBox API
    MAPBOX_TOKEN: "mapBoxToken",
    //< MapBox API
}

在我的app.js文件中，我嘗試使用這些鍵：

import keys from './keys';

//do stuff 

如果我嘗試在app.js文件中使用console.log(keys) ，我會得到一個{} ，這使它完全沒用。

這是正常行為，我錯過了范圍問題嗎？ 插入密鑰是否是一種糟糕的方式（我嘗試重現我的.env文件的行為）？

Answer 1

您不是從keys.js導出變量。 試試這樣..

export default keys = {
    //> Algolia/places API
    ALGOLIA_PLACE_APP_ID: "appKey",
    ALGOLIA_PLACE_API_ID: "APIkey",
    //###< Algolia/places API

    //> MapBox API
    MAPBOX_TOKEN: "mapBoxToken",
    //< MapBox API
}

Answer 2

Kelly Copley 的答案是可以的，但前提是您要默認導出keys 。 如果您希望以模塊化方式導出keys ，請嘗試如下操作：

export const keys = {
    //> Algolia/places API
    ALGOLIA_PLACE_APP_ID: "appKey",
    ALGOLIA_PLACE_API_ID: "APIkey",
    //###< Algolia/places API

    //> MapBox API
    MAPBOX_TOKEN: "mapBoxToken",
    //< MapBox API
}

然后你像這樣導入它：

import { keys } from './keys';