Importing an Object with SubObjects and Arrays in JavaScript

Question

I have a theme object that has a number of objects and arrays as values. I.e., something like this:

export const theme = {
  colors: {...list of colors},
  breakpoints: [...array of breakpoints],
  ...
}

Now, let's say I want to access the color object and breakpoints array in another document. Currently, I am importing theme like this:

import { theme } from '../../theme'
const { colors, breakpoints: bp } = theme
}

I am using breakpoints: bp so that I can alias breakpoints as bp in my file.

What I am wondering is whether or not it is possible to do all this in the import statement. I.e., instead of importing the entire theme object, to import just the color object and breakpoint array. Something like this (this code does NOT works, it's just to illustrate the idea):

import { theme.colors as colors, theme.breakpoints as bp } from '../../theme'

Is this possible? If so, how?

Thanks.

Kobe · Accepted Answer · 2019-11-13 14:02:24Z

1

It might be that you should change the way you export the theme. You could just export each property of theme - it's as simple as removing the const declaration and just exporting the object. :

export {
  colors: {...list of colors},
  breakpoints: [...array of breakpoints],
  ...
}

and then using import as such:

import { colors, breakpoints as bp } from '../../themes'

answered Nov 13, 2019 at 14:02

Kobe

6,4681 gold badge18 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dario García moya · Accepted Answer · 2019-11-13 15:11:57Z

0

I think that unfortunately, the import statements do not support the object destructuring.

I found this thread where this question was explained

How to import part of object in ES6 modules

answered Nov 13, 2019 at 15:11

Dario García moya

1325 bronze badges

Collectives™ on Stack Overflow

Importing an Object with SubObjects and Arrays in JavaScript

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related