Scss import Error for using exported component in new project

Hi,

we exported a card.js file and card.scss files to bit. internally I used card.scss file inside the card.js file
when I import the card.js file in new project from bit, i'am getting import error

Below are the snaps for configuration and error.

Card.js file includes
import React, { Component } from ‘react’;
import ‘./Card.scss’
class Card extends Component {
state = { }
render() {
return (


CARD
);
}
}

export default Card;

Card.scss includes
.Card{
width:400px;
height:400px;
background: green
}

bitmap file includes:
{
“muralikumar.quaqua/card@0.9.6”: {
“files”: [
{
“relativePath”: “components/card/Card.js”,
“test”: false,
“name”: “Card.js”
}
],
“mainFile”: “components/card/Card.js”,
“origin”: “AUTHORED”,
“exported”: true
},
“muralikumar.quaqua/card/card@0.9.6”: {
“files”: [
{
“relativePath”: “components/card/Card.scss”,
“test”: false,
“name”: “Card.scss”
}
],
“mainFile”: “components/card/Card.scss”,
“origin”: “AUTHORED”,
“exported”: true
},

when I imported the exported components and using the same i’m getting below error

@import ‘~@bit/muralikumar.quaqua.card.card’;
^

SyntaxError: Invalid or unexpected token