CODEWITHSUNDEEP
reactjsreduxcreate-react-app
Ash
Ash

Reputation: 574

How do I add a Babel plugin to a create-react-app project?

I'm following LearnCode.academy video tutorial and on video #7 at some point the tutor/presenter add the following code

@connect((store) => {
    return {user: store.user.user, tweets: store.tweers.tweers}
})

I understand I need to configure Webpack by adding babel-plugin-transform-decorators-legacy but create-react-app is not showing any of the configuration files. What is the solution here?

Upvotes: 2

Views: 2430

Answers (2)

Dan Abramov
Dan Abramov

Reputation: 268255

While you could eject for decorators it is completely unnecessary and comes with all downsides of ejecting (you don't get future updates to the tooling automatically).

Instead I recommend either using learning resources that don't rely on experimental features (which decorators currently are), or learning how to write equivalent code without them.

For example:

class MyComponent extends React.Component {
  // ...
}

export default connect((store) => {
    return {user: store.user.user, tweets: store.tweers.tweers}
})(MyComponent);

If you can't figure out how to write some example without decorators, create a new question and link to it in comments, and I'll try to answer.

Upvotes: 4

Andrew Li
Andrew Li

Reputation: 57964

In this case, you'll need to run the eject script to get all the configuration, and to change it from its defaults (this is irreversible, backup before attempting!). To do this, run:

npm run eject

This should add all the configuration files into your project, such as the Babel where you can add the plugin.

Upvotes: 3

Related Questions