Hi @kellymears
I tried this complete setup in Ubuntu OS by following the steps you had mentioned in your previous comment.
My bug.config.js file
/**
* Compiler configuration
*
* @see {@link https://roots.io/docs/sage sage documentation}
* @see {@link https://bud.js.org/guides/configure bud.js configuration guide}
*
* @type {import('@roots/bud').Config}
*/
export default async (app) => {
/**
* Application assets & entrypoints
*
* @see {@link https://bud.js.org/docs/bud.entry}
* @see {@link https://bud.js.org/docs/bud.assets}
*/
app
.entry('app', ['@scripts/app', '@styles/app'])
.entry('editor', ['@scripts/editor', '@styles/editor'])
.assets(['images']);
/**
* Set public path
*
* @see {@link https://bud.js.org/docs/bud.setPublicPath}
*/
app.setPublicPath('/wp-content/themes/gestories/public/');
/**
* Development server settings
*
* @see {@link https://bud.js.org/docs/bud.setUrl}
* @see {@link https://bud.js.org/docs/bud.setProxyUrl}
* @see {@link https://bud.js.org/docs/bud.watch}
*/
app
.setUrl('http://localhost:3000')
.setProxyUrl('http://ge-stories.local')
.setPublicUrl('http://ge-stories.local:3000')
.watch(['resources/views', 'app']);
app
.hooks.on('build.module.rules.oneOf', (rules = []) => {
rules.push({
test: /\.css$/,
use: [
'style-loader',
'css-loader',
'postcss-loader',
],
});
return rules;
});
/**
* Generate WordPress `theme.json`
*
* @note This overwrites `theme.json` on every build.
*
* @see {@link https://bud.js.org/extensions/sage/theme.json}
* @see {@link https://developer.wordpress.org/block-editor/how-to-guides/themes/theme-json}
*/
app.wpjson
.setSettings({
color: {
custom: false,
customDuotone: false,
customGradient: false,
defaultDuotone: false,
defaultGradients: false,
defaultPalette: false,
duotone: [],
},
custom: {
spacing: {},
typography: {
'font-size': {},
'line-height': {},
},
},
spacing: {
padding: true,
units: ['px', '%', 'em', 'rem', 'vw', 'vh'],
},
typography: {
customFontSize: false,
},
})
.useTailwindColors()
.useTailwindFontFamily()
.useTailwindFontSize();
};
Flywheel Settings:
After installing theme via composer. I tried the following commands:
yarn install
yarn bud upgrade
yarn build
yarn dev
Everything seem working. But as soon as I made any changes to JS or CSS file, I’m getting the following error to the browsers console and can’t see any changes are reflecting in dev url(localhost:3000).
GET
http://ge-stories.local:3000/wp-content/themes/gestories/public/js/app.js [HTTP/1.1 404 Not Found 25ms]
And the following warning to the page.
file_get_contents(/home/suraj/Local Sites/ge-stories/app/public/wp-content/themes/gestories/public/js/runtime.js): Failed to open stream
When I run yarn build
again the error goes and changes gets reflected. It seems like everytime I make any change I need to run build command to see the changes. But I’m expecting it should reflect instantly without making any build.
Can you please help into this? Is it related to configuration?
Thanks