How can Sails.js serve a Yeoman generated app

Question

I am new to Sails.js, and I'm pretty excited by it. It is a great tool for creating APIs. I am also working for a while with Yeoman generated single page apps (jquery or angular) and they are great for the client side logic.

However, currently the only way to make an app based on the two technologies is to separate them into two completely separate projects, which is wasteful.

I am looking for a way to combine the two. I want to make Sails.js serve the static assets of the web app and load its index.html file (instead of homepage.ejs). I also want the development environment (grunt, live-reload to work as it should).

I've tried creating a yeoman project inside the assets folder and redirecting the layout to the index.html but it has several issues: - I cannot separate between the app/ folder (during development) and the dist/ folder (in production) - the bower_components link is broken (it refers to /bower_components instead of /assets/app/bower_components)

I guess there might be more issues I haven't discovered yet.

Has anyone tried (and succeeded) combining these technologies?

Answer 1

You can serve the static index.html instead of homepage.ejs by doing the steps below:

1. place your index.html file under the assets folder.
2. open routes.js in config folder and change the code from

    '/': {
       view: 'homepage'
    }

to

    '/': {
       view: false
    }

The assets folder serves as the root folder in the website. If your "angular.min.js" file is located in "assets\bower_components\angular" folder, this will be converted to "/bower_components/angular/angular.min.js" in the browser.