Why my react bootstrap not working even after importing? - react-bootstrap

I tried to reinstall the package but still the problem is not fixed.

react-bootstrap is not shipped with any bootstrap-css:
https://react-bootstrap.netlify.app/getting-started/introduction/#stylesheets
Because React-Bootstrap doesn't depend on a very precise version of
Bootstrap, we don't ship with any included CSS.
Install bootstrap as well and then put this in your App.jsx for example:
import 'bootstrap/dist/css/bootstrap.min.css';
Or link to CDN package.

Related

Which vuetify file do I download to include in my project

I want to add vuetify to my project, but it can only be added by downloading files.
I have downloaded vuetify.min.css and vuetify.min.js
What other files do I need to download?
If you are using the Vue CLI then you can just add it like so:
vue add vuetify
The doc: https://vuetifyjs.com/en/getting-started/installation/#vue-cli-install
It also contains other installation methods if that one doesn't suit you, if you want to install it manually I think there are only these two (as seen in the code working with the CDNs), but maybe you'll want to use de Material Design Icons then you need to download that as well.

Template download page doesn't work correctly

I just tried to download ABP template with Angular and only one solution, but downloaded zip package seems contains VUE version instead.
Are others facing the same issue?

How to add Foundation framework to Laravel 5.5

How can I add lattest Zurb Foundation framework to Laravel 5.5? I want to change default Bootstrap framework to Foundation.
This is how I add the lattest Zurb Foundation framework to Laravel 5.5.
Hope it will help somebody.
Open package.json and remove bootstrap entry and then install lattest foundation-site version using npm:
npm install foundation-sites#latest --save-dev
Then go to resources/assets/sass/app.scss
You can import settings here if you have your own, if not you just need to import foundation.scss with default foundation settings:
#import "~foundation-sites/scss/foundation.scss";
#include foundation-everything(true);
Next step you need to go to node_modules/foundation-sites/sass/foundation.scss and do that steps:
Uncomment there a default settings import block which can be found at row number 18 or 20.
Then swap that settings import block with util import block placed right below the first one, because settings.scss needs util therefore it should be placed before.
Then go to node_modules/foundation-sites/sass/settings/_settings.scss, find there a default util import block at row number 63 and comment it. You do this because util imported before, so you aint need to duplicate that import.
Then go to resources/assets/js/bootstrap.js and change
require('bootstrap-sass');
to
require('foundation-sites');
$(document).foundation();
You don't need to change anything in webpack.mix.js

Install Modernizr with jspm?

Im trying to install Modernizr in my project with JSPM but I cant seem to find any documentation on this.
Ive tried both jspm install modernizr and jspm install npm:modernizr. Both download the Modernizr files but then I cant load it into my page.
Ive tried this in my main JS file but I keep getting a node error when I try and compile as it cant find the right files.
import 'modernizr';
import Modernizr from 'modernizr';
new Modernizr;
As I understand JSPM is a pollyfill that allows you to use ES6's module imports. Can Modernizr be imported as a module?
As Modernizr needs to run in the head I dont think its possible to use JSPM for this. Im going to use gulp modernizr instead:
https://github.com/doctyper/gulp-modernizr

SASS Settings in Foundation

I've installed SASS version and i have the _settings.scss file which is all are
commented.
How can i do some settings or some modifications here?
Shall i remove the comments and recompile?
Thanks.
Yes it's how you do this. And if you need some in depth changes then instead of importing foundation in app.scss file you can import elements individually(most likely you don't need all of them) so you can modify components separately while all other components will load from foundation gem and update.

Resources