Roots Discourse

Switching from Foundation to Bootstrap "Sage Preset?"


#1

Struggling to find out where I can switch from my original preference of Foundation back to Bootstrap 4.

I’ve not done any style or script editing or html yet - can I simple run sage preset again?

If so it’s not recognised when I’m trying in the console - maybe I’m in the wrong directory?


#2

If you haven’t made any changes to the styles or scripts, then you are okay you can just run the preset. If you had, I’d make a back up of your assets folder before you did. From the root of your theme, you should be to follow this:


#3

Wonderfully simple when you know how! Thanks I’ve added that to my notes too - I did buy the documentation but it wasn’t as extensive as I thought it maybe - this forum is priceless though


#4

Sorry I’ve run into 1 issue When trying to “yarn build”:

This relative module was not found:

  • ./autoload/_foundation.js in ./resources/assets/scripts/main.js

I’ve looked in main.js and it doesn’t mention anything hardcoded to foundation and in the autoload folder for styles and scripts just has _bootstrap files

Any ideas - maybe a kind of cache issue?


#5

When you ran the preset, did you say yes to prompt to override the files? You need to do that so it can add the _foundation.js to the autoload folder.


#6

yep - I just ran it again to check and got the same error

This relative module was not found:

  • ./autoload/_foundation.js in ./resources/assets/scripts/main.js
    Asset Size Chunks Chunk Names
    scripts/main.js 11.5 kB 0 [emitted] main
    scripts/customizer.js 3.25 kB 1 [emitted] customizer
    styles/main.css 237 kB 0 [emitted] main
    scripts/main.js.map 14.7 kB 0 [emitted] main
    styles/main.css.map 423 kB 0 [emitted] main
    scripts/customizer.js.map 3.08 kB 1 [emitted] customizer
    error Command failed with exit code 2.
    info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

#7

My main.js looks like this:

// import external dependencies
import ‘jquery’;

// Import everything from autoload
import “./autoload/**/*”

// import local dependencies
import Router from ‘./util/Router’;
import common from ‘./routes/common’;
import home from ‘./routes/home’;
import aboutUs from ‘./routes/about’;
import map from ‘./routes/map’;

/** Populate Router instance with DOM routes */
const routes = new Router({
// All pages
common,
// Home page
home,
// About Us page, note the change from about-us to aboutUs.
aboutUs,
map,
});

// Load Events
jQuery(document).ready(() => routes.loadEvents());


#8

Here are the stubs for each preset:


#9

Just wipe the theme directory and start from scratch if you’re having this many problems :wink:


#10

#11

Sorry I couldn’t reply… it was simply a caching issue - so I emptied my .cache-loaded folder and it worked just fine. I guess that was meant to be automated with the preset line to clear the cache but it didn’t seem to work.