Conditional styling import gets bundle together after build in reactjs

Question

I'm got stuck in this,

if (condition) {
  import("./style1.css");
} else {
  import("./style2.css");
}

When trying to import styling conditionally. It works locally, But when you build the app then both styles combines. And gets conflicts.

Thank you !!!

Rain.To · Accepted Answer · 2020-06-12 00:07:26Z

1

Are you using below in your babel configuration.

@babel/plugin-syntax-dynamic-import

you need to configure Babel to transpile your dynamic imports.

Also the Webpack syntax mentions to use it like a promise.

edited Jun 12, 2020 at 0:07

answered Jun 12, 2020 at 0:00

Rain.To

5122 silver badges7 bronze badges

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

2 Comments

Sachin Dongare Over a year ago

Thanks Once Again. No I'm not using @babel/plugin-syntax-dynamic-import. Also I've tried import using promise still not working. Could you explain updation in babel configuration.

Rain.To Over a year ago

Ok, you would need to use this plugin - so that dynamic import works , Here is an article to provide some assistance blog.jscrambler.com/… . If you don't use babel at all then require.ensure is another way. Give the above two a try and let know.

Collectives™ on Stack Overflow

Conditional styling import gets bundle together after build in reactjs

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related