1

the problem I try to solve

import * as React from 'react'; import {Component} from 'react';

I dont like it being two lines - to be frank it is not even allowed by my linter settings.

But writing the following import * as React from 'react'; const Component = React.Component; doesnt look fine to me as welll - as I willl have llines of imports and than const delarations - which are actually imports

in a non TS syntax the above lines could have been

import React, {Component} from 'react';

and this is what I am looking for, but

import * as React, {Component} from 'react'; is not a valid syntax.

The question

how can I acchieve a one liner with namespace import and partial import

Improve this question
2
  • 1
    Have you tried import * as React from 'react' and then class A extends React.Component {} Commented Feb 24, 2018 at 20:20
  • @Aaqib good though - that would work - but I mean more of a general example Commented Feb 25, 2018 at 6:00

1 Answer 1

Reset to default
4

Starting from TypeScript 2.7, you can enable esModuleInterop in your tsconfig.json to enable import React, { component } from 'react'

There is a specific meaning for import * as React from 'react', which is getting the module namespace object of the module react. As it gets everything in the module, it is more natural to use React.component then extracting component using the import { component } from 'react' in addition.

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

1 Comment

it did the job - specifically with React there is a small issue - that this stackoverflow.com/questions/48785451/… topic helped to resolve

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.