The nb-install mixin is not recognized

While working with angular5, I encountered the 'No mixin named nb-install' error when running npm start or serve

Module build failed:
undefined
        ^
      No mixin named nb-install

Backtrace:
        stdin:13
      in E:\mrb_bugfixes\bottledepot\src\app\@theme\styles\styles.scss (line 13, column 10)

The file that is causing the issue is named 'styles.scss'

@import 'themes';

// framework component themes (styles linked to theme variables)
@import '~@nebular/theme/styles/globals';
@import '~@nebular/auth/styles/all';

// loading progress bar theme
@import './pace.theme.scss';

// install the framework and custom global styles

@include nb-install() {

// framework global styles
@include nb-theme-global();
@include nb-auth-global();

// loading progress bar
@include ngx-pace-theme();

.custom-control .custom-control-indicator {
border-radius: 50%; // TODO: quickfix for 
https://github.com/akveo/nebular/issues/275
}
};

Answer №1

It took me quite a while to figure out how to install these necessary dependencies...

npm install --save @nebular/theme @angular/cdk @angular/animations

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How to align li elements at center in a Bootstrap navbar

I'm having trouble centering link1 and link2 both horizontally and vertically on the page. The horizontal alignment is working fine, but I can't seem to get the vertical alignment right, no matter what I try. Here is the HTML code snippet: ...

Angular 2: Navigating through submenu items

I have a question about how to route submenu elements in Angular 2. The structure of my project is as follows: -app ---login ---registration ---mainApp (this is the main part of the app, with a static menu and links) -----subMenu1 (link to some con ...

Guide on transitioning Angular 2 RC 1 (or an earlier version) Forms to the new Forms in Angular 2 RC 2 / RC 4

I am currently in the process of upgrading my Angular 2 RC 1 app to Angular 2 RC 4, and part of this update involves migrating my existing forms to Angular 2 RC 4 New Forms. Could someone provide guidance on how to successfully update my existing forms to ...

Setting up the Angular 2 router to function from the /src subfolder

My goal is to create two separate subfolders within my project: src and dist. Here are the key elements of my application: root folder: C:\Server\htdocs\ app folder: C:\Server\htdocs\src index.html contains <base href="/ ...

What is preventing my div from reaching 100% height when I implement an HTML5 doctype? Is there a solution to achieving a full height div?

I'm currently working on organizing the layout for a basic gallery webapp, and I've encountered an issue where some of my divs are shrinking in height when using an HTML5 doctype declaration. Despite trying different CSS properties, I can't ...

Utilizing two distinct CSS frameworks within a single Rails application

At the moment, I have an application with its frontend built using Bootstrap 3 (leveraging the bootstrap-rails gem). Now, I am looking to incorporate the Materialize.css framework into the same app. After downloading the Materialize.css stylesheet, my conc ...

Evaluating Angular/Typescript and its capabilities

I seem to be struggling with the concept of how eval functions in TypeScript/Angular. Can someone provide some guidance on how to make eval work in this scenario? Although the logic may not be perfect in this demo program, I just need help figuring out how ...

Avoiding the selection of HTML canvas objects

I am currently working on customizing my homepage with an interactive animation. However, I am facing some challenges in integrating it seamlessly into the page. You can view the progress at . My main issue is preventing the canvas object from being select ...

Print media not affected by Bootstrap styling

Below is the code I am using to display a table within my application: var elementToPrint = this.mainTable.get(0); newWin = window.open(""); newWin.document.write('<html><head><title>' + elementToP ...

When should CSS compression and combining / JS minification be performed - at runtime or during build time?

I need to find a way to compress, version (for caching reasons), and possibly combine our JS and CSS files. I've come across two main approaches so far: 1) During the build process: Using an MSBuild task or similar. 2) Dynamically at runtime: Through ...

Troubleshooting: HTML drop-down menu experiencing malfunctions

As a newcomer to the realm of HTML, I am eager to kickstart my online portfolio. After successfully setting up the navigation bar, I have now turned my focus towards creating a dropdown menu within the nav bar. Unfortunately, I've hit a roadblock as t ...

Tips for properly aligning blockquote opening and closing quotation marks

We are currently implementing custom styles for beginning and end quotes in a string using the <blockquote> tag. However, we are having issues with the alignment, as the opening quote appears before the text and the closing quote is at the end of the ...

Rearrange items in a display: contents wrapper using CSS Grid

I'm having trouble positioning descendants in a root grid while they are enclosed in a container with display: contents. The issue I am facing is that one element is not being correctly placed within the grid: .wrapper { width: 80ch; margin: a ...

Employ the use of expressions to retrieve and store input values within a template

<input ngModel name='quantity' placeholder='Quantity' type="number" class="form-control" pattern="^\d*(\.\d{0,2})?$" required /> <input ngModel name='price' c ...

Utilizing CSS to place an image on top of the upcoming <div> container

My goal is to create a layout similar to the one displayed in the linked image. https://i.stack.imgur.com/7DSE9.jpg Currently, I am using Bootstrap 3 and my HTML markup looks like this: <body class="gray-bg"> <section class="white-bg"> <d ...

What is the best way to showcase HTML content in columns with a horizontal scrolling feature?

I am trying to showcase a list of basic HTML elements such as divs, paragraphs, etc. within a fixed height container, arranged in columns with consistent width. I want them to be horizontally scrollable, similar to the layout displayed in this image. Thi ...

Solutions for concealing the current div when clicking on a new div that reveals a fresh one

Is there a way to hide the current div once you click on a new div that reveals another one? The code below toggles the display of the div, but what I am attempting to achieve is that when you click on a new item after clicking on the first one, the first ...

iOS emphasizes special characters by printing them in bold

Some parts of the website I am managing are showing German umlauts in bold (as seen in the screenshot). The font style being used is font-family: Source Sans Pro, Arial, sans-serif; with font-weight: 300. This font is sourced from Google Fonts. When I cha ...

Issue with displaying children in Angular 2 router: children components not appearing on the

I am currently in the process of incorporating a user authentication bundle into my Angular 2 project by following this tutorial at . I have organized all the files from the bundle into a parent folder named "loginMGR", and modified the module, components ...

Experience the dynamic expansion of a droppable div as you elegantly drop an element within

When the questions "question1" and "question2" are dragged into "questionslots," I want the "questionSlots" div to expand its size dynamically when the second question is dropped into it. This means that both questions should be accommodated and visible wi ...