'Review' is not exported from './Review'

Question

I have a problem.

i created Review.jsx file. i use rafce and I wrote the code. I want to import it to another file, but it writes a problem. 'Review' is not exported from './Review'

in another file code from import - import { Review } from './Review';

Review and this file in the same folder

Review.jsx Code

import React from 'react';
import { Typography, List, ListItem, ListItemText } from '@material-ui/core';


const Review = ({ checkoutToken }) => {
    return (
        <>
            <Typography variant="h6" gutterBottom>Order Summary</Typography>
            <List disablePadding>
                {checkoutToken.live.line_items.map((product) => (
                    <ListItem style={{padding: '10px 0' }} key={product.name}>
                        <ListItemText primary={product.name} secondary={`Quanity: ${product.quanity}`} />
                        <Typography variant="body2">{product.line_total.formatted_with_symbol}</Typography>

                    </ListItem>
                ))}
                <ListItem style={{padding: '10px 0' }}>
                    <ListItemText primary="Total" />
                    <Typography variant="subtotal" style={{fontWeight: 700}}>
                        {checkoutToken.live.subtotal.formatted_with_symbol}
                    </Typography>

                </ListItem>
            </List>
        </>
    )
}

export default Review;

Could you provide some code snippets? Maybe your component and the import line. — Leonardo Viada, Mar 08 '21 at 13:33
You need to export `Review` function / class component in `Review.jsx` file. You can do default or named export. See [Export](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export) — Ajeet Shah, Mar 08 '21 at 13:34

score 2 · Accepted Answer · answered Mar 08 '21 at 13:36

2

In Review.jsx file you need to export your function/component in a following way:

export const Review = // your function/component here;

And only then you can import it in a following way

import { Review } from './Review';

answered Mar 08 '21 at 13:36

Pavlov Serhiy

314
1
4

i use rafce, so its exported default. pls see edited post and code – Gmolashvili Mar 08 '21 at 13:39
you have a default export 'export default Review;' in this case you can import the review in other file in this format 'import Review from './Review';' – Pavlov Serhiy Mar 08 '21 at 13:42
if you want to use 'import { Review } from './Review';' just remove the default export in the end of the file and change initialization of your component to 'export const Review = ({ checkoutToken }) => { ...' – Pavlov Serhiy Mar 08 '21 at 13:44

'Review' is not exported from './Review'

1 Answers1