Andrew Bettke
Andrew Bettke

Reputation: 201

SailsJs - Serving Angular App from Assets

Within a new SailsJs application I'm trying to serve an angular app from the assets folder. Considering assets/admin/index.html I can access localhost:1337/admin, however, none of the additional js files or sub-directories can be accessed. I've even checked the .tmp/public folder and everything is copying over correctly but when I try to refer to any file within the admin folder other than index.html it can not be found.

enter image description here

Referring to angular module in index.html

<!--Sailes IO Library-->
<script src="/js/dependencies/sails.io.js"></script>

<!--Vendor Scripts-->
<script src="/js/angular-animate.js"></script>
<script src="/js/angular-aria.js"></script>
<script src="/js/angular-material.js"></script>
<script src="/js/angular-messages.js"></script>
<script src="/js/angular.js"></script>
<script src="/js/release/angular-ui-router.js"></script>

<!--Admin Application Definition-->
<script src="/admin/app.js"></script>
<script src="/admin/config/router.js"></script>

However, app.js is not being served!

enter image description here

Can I not do it this way? How can I access my angular application files from the admin folder?

Upvotes: 1

Views: 236

Answers (2)

Andrew Bettke
Andrew Bettke

Reputation: 201

After reading the documentation a little more in-depth, sails will also serve index.html files found in the assets folder. So I created a new folder, inside that folder I created a new index.html and app.js file, and then lifted. My index.html file was then available at a url that matched my folder name. My folder was called "admin" so navigating to localhost:1337/admin loaded my index.html page.

As far as serving the other dependencies, I used grunt-bower and a new grunt task to start serving my bower_components over to my assets/vendor folder.

Upvotes: 0

selftaught91
selftaught91

Reputation: 7481

To load an angular application in sails.js you need to serve the index.html file from the views folder.

so in you config/routes.js

'/': {
    view: 'homepage'
}

this means when you hit the root of you application then homepage.ejs from the views folder is served

copy the contents of assest/admin/index.html file in homepage.ejs and if necessary check that all the link and script tags have the file path relative to assets folder.

once the homepage is served you can use angular ui router for routing purpose

Note--

change your localhost:1337/admin to

localhost:1337

Upvotes: 2

Related Questions