CODEWITHSUNDEEP
javascriptecmascript-6importdestructuring
Erazihel
Erazihel

Reputation: 7605

Using destructuring and renaming with import

I'm currently building a bot for Slack using the node-slack-sdk. In their examples they got the following line:

var CLIENT_EVENTS = require('@slack/client').CLIENT_EVENTS;

The CLIENT_EVENTS is then used as follow:

rtm.on(CLIENT_EVENTS.RTM.AUTHENTICATED, 
  function handleRTMAuthenticated() {
    console.log('RTM client authenticated!');
});

I've changed the require in order to use destructuring to directly get the CLIENT_EVENTS.RTM object that I renamed RTM_CLIENT_EVENTS.

const {
  CLIENT_EVENTS: { RTM: RTM_CLIENT_EVENTS },
} = require('@slack/client');

Now, I wanted to change the require to an import:

import {
  CLIENT_EVENTS: { RTM: RTM_CLIENT_EVENTS },
} from '@slack/client';

But I got the following error:

ES2015 named imports do not destructure. Use another statement for destructuring after the import

Any idea why they don't destructure?

Upvotes: 20

Views: 13358

Answers (2)

Aditya Tripathi
Aditya Tripathi

Reputation: 171

The import statement in javascript does not natively support the destructuring syntax. But you can rename the imports in the following ways:

import {RTM_CLIENT_EVENTS as RTM} from '@slack/client'

Here the RTM_CLIENT_EVENTS propery will be imported and renamed to RTM using the as keyword.

Upvotes: 17

Estus Flask
Estus Flask

Reputation: 222855

import has strict syntax that only mimics shallow destructuring syntax but is supposed to be statically analyzed. So does export, it mimics object literal syntax.

As the error suggests, the proper way to do this is

import { CLIENT_EVENTS }  from '@slack/client';

const { RTM: RTM_CLIENT_EVENTS } = CLIENT_EVENTS;

Upvotes: 31

Related Questions