[bug] Unable to generate source maps with Sage

[kupoback]

Agreement

• This is not a duplicate of an existing issue
• I have read the guidelines for Contributing to Roots Projects
• This is not a personal support request that should be posted on the Roots Discourse community

Describe the issue

When trying to run an earlier example of a similar issue, no form of suggestions in the topic generated a source map in the end. Also, while trying to mess with this, despite just before using @roots/bud, @roots/bud-tailwindcss, and @roots/sage, I am now required to install @roots/bud-sass despite before bud was compiling SCSS with no issues.

Expected Behavior

A source-map generated for the SCSS files.

Actual Behavior

Just a normal CSS file is created

Steps To Reproduce

1. Install @roots/bud @roots/bud-tailwindcss, @roots/sage, @roots/bud-sass
2. Create SCSS files, @import them into the main scss file
3. Run yarn bud
4. See the public directory just has css files.

version

6.11.0

Logs

No response

Configuration

module.exports = async (app) => {
    app
        .alias({
            "@sageAdmin": "@src/admin_assets",
            // React script alias'
            "@sageReact": "@src/react",
            "@sageRedux": "@src/react/Redux",
            "@reactComponent": "@src/react/Components",
            "@reactPages": "@src/react/Pages",
            "@reactUtil": "@src/react/Util"
        })

        .entry({
            app: ["@scripts/app", "@styles/app"],
            editor: ["@scripts/editor", "@styles/editor"],
            admin: ["@sageAdmin/css/admin_styles", "@sageAdmin/js/sage-admin"],
            sageReact: ["@sageReact/app"],
            blog: ['@sageReact/Pages/Blog/blog-index'],
        })

        .assets(["images", "fonts"])

        .watch(
            [
                "app/**/*",
                "resources/react/**/*",
                "resources/scripts/**/*",
                "resources/styles/**/*",
                "resources/views/**/*",
                "resources/vue/**/*",
            ]
        )

        .proxy("https://boilerplate8.1.test")
        .serve("http://localhost:3000")
        .setPublicPath("/app/themes/sage/public/")
        .wpjson
        .settings()
        .useTailwindColors()
        .useTailwindFontFamily()
        .useTailwindFontSize()
        .enable()
};

Relevant .budfiles

No response

[kellymears]

I am now required to install @roots/bud-sass despite before bud was compiling SCSS with no issues.

I'm so sorry for this injustice.

Expected behavior

A source-map generated for the SCSS files.

Why did you expect that behavior?

Sage isn't configured to generate a source-map in production, only development. If you want to configure it differently you can use bud.devtool or the --devtool flag with the bud build command.

The function has 100% test coverage and works fine:

bud/sources/@roots/bud-api/src/methods/devtool/devtool.test.ts

Lines 12 to 47 in 6b7d63d

	beforeEach(async () => {
	bud = await factory()
	bud.hooks.on = callback
	method = devtool.bind(bud)
	vi.clearAllMocks()
	})
	it(`is a function`, () => {
	expect(method).toBeInstanceOf(Function)
	})
	it(`returns bud`, async () => {
	const ret = await method()
	expect(ret).toBe(bud)
	})
	it(`calls bud.hooks.on`, async () => {
	const onSpy = vi.spyOn(bud.hooks, `on`)
	await method()
	expect(onSpy).toHaveBeenCalledTimes(1)
	})
	it(`calls bud.hooks.on`, async () => {
	const onSpy = vi.spyOn(bud.hooks, `on`)
	await method()
	expect(onSpy).toHaveBeenCalledWith(
	`build.devtool`,
	`cheap-module-source-map`,
	)
	})
	it(`calls bud.hooks.on with expected arguments`, async () => {
	const onSpy = vi.spyOn(bud.hooks, `on`)
	await method(callback)
	expect(onSpy).toHaveBeenCalledWith(`build.devtool`, callback)
	})

[kupoback]

@kellymears Okay, so looking at it, I need to update my build script to run as development, and then add some filters so that it doesn't use BrowserSync. Reason I mention this is that we have development sites, and our Frontend developers need to reference SCSS files, despite it not being needed for a final production.