Correct way to create a theme from scratch in Angular 8 (Bootstrap) - angular8

I am new to Angular 8. I am confused in creating the theme for Angular 8. I searched for this in many site but they are using the jQuery and Popper.js. So, jQuery is the reason that's why I am confused.
What is the correct way to implement the bootstrap theme in Angular. Can we implement it without using jQuery?

Install Bootstrap
run npm install bootstrap
Add bootstrap.scss to your angular.json file
projects->yourproject->architect->options->styles Add
"styles": ["node_modules/bootstrap/scss/bootstrap.scss"]
If you are after JS interactions like dropdowns..etc , install ng-bootstrap
run npm install --save #ng-bootstrap/ng-bootstrap
Doco: https://ng-bootstrap.github.io/#/components/alert/examples
Done. No JQuery or Popper.js required

Related

Creating own npm package vue.js and vuetify

Hi I wanted to ask if someone can help me with this I am trying to create my own package to publish on npm so what I wanted is that to add vuetify on my package and install my own package to a project that is also using vuetify. Right now I am using vue-sfc-rollup and I have installed vuetify on my package but it seemed it doesnt work it gives me an error Unknown custom element: <v-form> is it because I am using vuetify on both package and the project?

Nuxt Buefy components using CDN

I am new to nuxt. I want to know whether is it possible to use Buefy on nuxt just by using CDN
as I directly imported beufy CDN in script in head function of nuxt.config
But it gave error while using navbar of beufy that the component is not registered correctly.
Nuxt supports buefy by default, when installing using npx create-nuxt-app you'll be asked if you want to use a component framework (buefy is an option here).
If you want to use it in an installed project you can npm install buefy --save and then add "nuxt-buefy" in the modules array of your nuxt.config

Integrate a stenciljs web component into a stenciljs app

I did build some web components with stencil and published them on npm. Now I want to integrate them into another stencil app but I can't find any suggestions how to do so or the suggestions I found so far are not working.
e.g. there is no collections attribute anymore on the stencil config to include external components and this, which I found on the official documentation to distribute the components is not working:
In a stencil-app-starter app
Run npm install my-name --save
Add an import to the npm packages: import my-component;
Then you can use the element anywhere in your template, JSX, html etc.
I know that the components work because I successfully integrated them into an Angular and React App already.
Thanks for your help in advance :)
I had the same problem and just solved it. I'm building a StencilJS app and tried to use my component library #elgervb/stencil-components.
Here is what I did to get it working:
I've added my library with:
yarn add #elgervb/stencil-components
and in tsconfig.json I added typeRoots to the compilerOptions to load my types:
"typeRoots": [
"node_modules/#elgervb"
]
After that I can use all of my components in my app:
<evb-filepicker accept="image/*">
<evb-button>Pick image</evb-button>
</evb-filepicker>
Hope this helps :-)

How do you add Font Awesome to Aurelia using aurelia cli version 1.0.0-beta.13 with the webpack option and npm

With version 1.0.0-beta.13 of the aurelia cli with the webpack option selected I am trying to add Font Awesome via npm. There are several questions regarding this but nothing with the current cli and webpack. I have installed Font Awesome via npm and imported it into my main.js
import 'font-awesome/css/font-awesome.css
I have also tried requiring it in my app.html but it still does not work. I can add the Font Awesome cdn link to my index.ejs and it works as expected but I would like to use it via npm.
Thanks

react-native version of HTML script tag?

I need to use the methods of an eternal API in my native project.
If this were react I would just do
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"</script>
for example, I don't need bootstrap specifically.
Is there a way to do this in react-native?
You can use npm to manage your dependencies. Your react-native project should already be configured for this. You can install dependencies like this npm install --save my-react-native-module. Sometimes you will have to link them like this react-native link my-react-native-module. Most of those dependencies will write on their read me page how to install them.