Running a new jHipster Application using Compass and the main CSS file is not loading

How to fix a Newly Created jHipster Application not Loading the Main CSS File 


If you see an error similar to the following upon first startup of a jHipster application you have just created:

Failed to load resource: the server responded with a status of 404 (Not Found) http://127.0.0.1:8080/assets/styles/main.css


Issue loading main.css on jHipster application
jHipster with CSS not loaded


Then you will need to run the grunt task, grunt compass.


Install Compass

You will need to first install Compass, an open-source CSS Authoring Framework before you can run the Grunt task to create the main.css file which is missing.

Using node:

npm install compass

Reference the following link for more info about installing compass using npm


Run Grunt Task


After you install Compass, you will then need to run the grunt task.  In in IntelliJ you can click the grunt task runner at the bottom of your screen or go to Tools -> Open Grunt Console.

Use grunt task runner console to create Main CSS file
Run grunt compass task to create main.css file

Restart your Application


Try refreshing and restarting your application and the styling should now display correctly.

mvn spring-boot:run

Comments

Post a Comment

Popular posts from this blog

Change Port on a Spring Boot Application when using intelliJ

Image
Change Port on a Spring Boot Application when using intelliJ  Two ways to change the port that the embedded Tomcat is using in a Spring Boot Application. The first way is to modify the application properties in the resources folder: Update application props in Spring Boot Application There are a couple issues with this approach.  You might only want this port change in your local environment and if you check it in by accident you might break things. Alternatively, you can use a command line parameter. Go to Run -> Edit Configurations -> VM options Then enter in the following argument: -Dserver.port=8090 Then click apply and OK and attempt to run the application again. Update port using VM option
Keep reading

How to set up a SQL Server 2008 Local Database

Image
Setting up and Configuring your Microsoft SQL Server 2008 Local Database Download SQL Server Download SQL Server Express.  Express is the Free edition of MS SQL Server http://www.microsoft.com/en-us/download/details.aspx?id=1695 Install your SQL Server Instance Click the Start button -> Click Microsoft SQL Server 2008 -> Click Configuration Tools -> Select SQL Server Installation Center Select Installation -> Select New SQL Server stand-alone installation Select SQL Server stand-alone installation Get your Local SQL Server Service Up and Running Open up the SQL Server Configuration Manager Click the Start button -> Click Microsoft SQL Server 2008 -> Click Configuration Tools -> Select SQL Server Configuration Manager Setup SQL Server Config Manager Start up the SQL Services You want to ensure the following services are in the "Running" State and then you want to set the following services to automatic St
Keep reading

New Personal Website

Image
Just built my new personal website using GatsbyJS( https://www.gatsbyjs.org/ ) Very cool framework that allows a backend services engineer like myself to use all the slick, new front-end tech(react, graphql, webpack etc) out of the box. Check it out. http://chris-anatalio.dev 😁😁😁
Keep reading