# Sage Classic Editor Styles

**URL:** https://discourse.roots.io/t/sage-classic-editor-styles/22792
**Category:** sage
**Tags:** sage10
**Created:** 2022-04-02T18:19:04Z
**Posts:** 3

## Post 1 by @christianmagill — 2022-04-02T18:19:04Z

I’m attempting to use add\_editor\_style to load my compiled app.scss file in TinyMCE.

I’ve read that we should use \Roots\bundle for this, but looking at its code I can’t figure out the right combination.

The most recent I’ve tried would be

add\_editor\_style(bundle(‘app’)-\>css()-\>first());

But whenever I use the css() method I get the following error:

Warning: Undefined array key “css” in /Sites/lakeshore/wp-content/plugins/acorn/src/Roots/Acorn/Assets/Bundle.php on line 50

Thanks for any help you can provide.

---

## Post 2 by @alwaysblank — 2022-04-02T20:33:13Z

> [@christianmagill](#):
>
> Warning: Undefined array key “css” in /Sites/lakeshore/wp-content/plugins/acorn/src/Roots/Acorn/Assets/Bundle.php on line 50

Looks like your bundle doesn’t have any CSS in it:

> <https://github.com/roots/acorn/blob/c714b798bc05d6929894a3119bbae3109d5eaf99/src/Roots/Acorn/Assets/Bundle.php#L50>

1. Have you run a build?
2. Have you checked your `manifest.json` to see what’s being built?
3. What’s your bud configuration look like?

---

## Post 3 by @christianmagill — 2022-04-02T21:15:47Z

Hm… Strange…

Checking the manifest.json I’m not seeing my CSS file referenced. It is getting loaded fine on the frontend. I have run the build process.

I’m using the @roots/bud-sass package. Here’s my config.

```
/**
 * @typedef {import('@roots/bud').Bud} bud
 *
 * @param {bud} app
 */
module.exports = async (app) => {
  app
    /**
     * Application entrypoints
     *
     * Paths are relative to your resources directory
     */
    .entry({
      app: ['@scripts/app', '@styles/app'],
      admin: ['@scripts/admin', '@styles/admin'],
      editor: ['@scripts/editor', '@styles/editor'],
    })

    .hooks.on("build.module.noParse", undefined)

    .provide({
      jquery: ["jQuery", "$"],
    })

    /**
     * These files should be processed as part of the build
     * even if they are not explicitly imported in application assets.
     */
    .assets('images')

    /**
     * These files will trigger a full page reload
     * when modified.
     */
    .watch('resources/views/ **/*', 'app/** /*')

    /**
     * Target URL to be proxied by the dev server.
     *
     * This is your local dev server.
     */
    .proxy('http://lakeshore.test')

    /**
     * Development URL
     */
    .serve('http://lakeshore.test:3000');
};
```

Thanks
