我正在尝试将国家/地区列表放在 a.js 文件中并将其导出以供重复使用。 得到错误

Question

I am building a react/material-ui site and want to create a countries.js file that has the following in it (as an example)

  export default const countryList =  [
  {
    "label": "United States",
    "value": "US"
  },
  {
    "label": "Afghanistan",
    "value": "AF"
  },
   ...
  ]

I want to be able to import this as follows:

import countryList from '/json/countries.js'

where countryList will be the array that I can map like countryList.map...

I keep getting a parsing error, no matter how I define the function. What am I doing wrong?

UPDATE: After an answer from Prachi below, I tried to export/import like this:

export const Countries = [
    {
      "label": "United States",
      "value": "US"
    },
    {
      "label": "Afghanistan",
      "value": "AF"
    }
]
export default Countries;

Then I import the file as follows. My intellisense tells me I have the correct path because I can see 'json' folder name in my intellisense list when typing:

import Countries from '../../../json/Countries';

I still receive the following error:

Module not found: Can't resolve '../../../json/Countries' in 'C:\projects\DoxaProject\DoxaUI\DoxaUI\ClientApp\src\pages\patientpage\forms'

Any help on solving this would be greatly appreciated!

Answer 1

The default export can only take an expression; const and let statements are not allowed. For example:- const MyComponent = () => { return <div class="foo">HI</div> ; }; export default MyComponent; You should write your code as:

        export const countryList = [
      {
        label: "United States",
        value: "US"
      },
      {
        label: "Afghanistan",
        value: "AF"
      }
    ];

export default countryList;

And import it as:

   import countryList from "./country";