Import packages with yarn or npm and install them correctly

Posted 2 years ago by eddieace

Hi, I wonder if there is a complete guide on to instal packages with yarn or NPM. I have done this successfully a few times but it's always a struggle to get it to work together with gulp and elixir.

That are a few packages that you need in alot of projects, for example

bootstrap-datepicker bootstrap-tagsinput datatables font-awesome

What I do when i add these packages is to run;

  1. Int the terminal i run yarn add bootstrap-tagsinput

It is then loaded into my package.json

  1. Secondly I run yarn to install all my dependencies

  2. Then i need to import it both in my resources/assets/js and resources/assets/sass

Here comes the tricky part. I then want to import all the code into app.js and app.css so i need to import the files from assests

I do something like this. in the app.js

/**
 * First we will load all of this project's JavaScript dependencies which
 * include Vue and Vue Resource. This gives a great starting point for
 * building robust, powerful web applications using Vue and Laravel.
 */

require('./bootstrap');
require('bootstrap-tagsinput');

In the css i do this.

// Fonts
@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);

// Variables
@import "variables";

// Bootstrap
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";

@import "node_modules/bootstrap-tagsinput/dist/bootstrap-tags-input";

@import "style";

I then guess that gulp should import all these files into app.css and app.js in my public folder.

Is this correct?

Please sign in or create an account to participate in this conversation.

Reply to

Use Markdown with GitHub-flavored code blocks.