Is it possible to import a Sass/Scss file into a Lit component?

[segovia94]

I would like to be able to import a sass stylesheet into a Lit web component, but it doesn't seem to be possible. Here is an example of how it might look:

import { LitElement, html, unsafeCSS } from 'lit'
import styles from './app-message.scss'

export class AppMessage extends LitElement {
  static get styles() {
    return unsafeCSS(styles)
  }

  render() {
    return html`
      <p>Styles Added</p>
    `
  }
}

window.customElements.define('app-message', AppMessage)

I'm using the @snowpack/plugin-sass plugin, but it doesn't seem to help here. Anyone else trying to do this? Any ideas on how to get it to work?

[segovia94]

I get a console error: Uncaught SyntaxError: import not found: default