Search code examples
javascriptsails.jssails-mongosails.io.js

Not able to add scripts in layout.ejs (sails.js)

I am trying to add a route.js file in the layout.ejs.

<!DOCTYPE html>
<html ng-app="scratchpad">
  <head>
    <title>Scratchpad</title>

    <!-- Viewport mobile tag for sensible mobile support -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">


    <!--
        Stylesheets and Preprocessors
        ==============================

        You can always bring in CSS files manually with `<link>` tags, or asynchronously
        using a solution like AMD (RequireJS).  Or, if you like, you can take advantage
        of Sails' conventional asset pipeline (boilerplate Gruntfile).

        By default, stylesheets from your `assets/styles` folder are included
        here automatically (between STYLES and STYLES END). Both CSS (.css) and LESS (.less)
        are supported. In production, your styles will be minified and concatenated into
        a single file.

        To customize any part of the built-in behavior, just edit `tasks/pipeline.js`.
        For example, here are a few things you could do:

            + Change the order of your CSS files
            + Import stylesheets from other directories
            + Use a different or additional preprocessor, like SASS, SCSS or Stylus
    -->
    <!--Twitter Bootstrap-->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    <!--Twitter Bootstrap END-->
    <!--STYLES-->
    <link rel="stylesheet" href="/styles/border.css">
    <link rel="stylesheet" href="/styles/tablerow.css">
    <!--STYLES END-->
  </head>

  <body>
    <nav class = "navbar navbar-default" role = "navigation">
      <div class = "container-fluid">
        <div class = "navbar-header">
          <a class = "navbar-brand" ui-sref = "scratchpad">MY SCRATCHPAD</a>
        </div>
      </div>

    </nav>


    <p>hello world</p>

    <div class = "container">
      <div ui-view></div>
    </div>

    <!--SCRIPTS-->
    <script src="/js/dependencies/sails.io.js"></script>
    <script src="/js/dependencies/bower_components/jquery/dist/jquery.min.js"></script>
    <script src="/js/dependencies/bower_components/angular/angular.min.js"></script>
    <script src="/js/dependencies/bower_components/angular-resource/angular-resource.min.js"></script>
    <script src="/js/dependencies/bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
    <script src="/js/dependencies/bower_components/moment/moment.js"></script>
    <script src="/js/dependencies/application.js"></script>
    <script src="/js/dependencies/route.js"></script>

    <!--SCRIPTS END-->
  </body>
</html>

Whenever i add this and save it. Its got saved. But when i try to run sails lift. The route.js script getting gone and the layout.ejs file changes into old state. Can anyone figure this out? Any idea of what may be the bug? cause of grunt?

Solution

  • As long as I remember, everything inside 

     <!--SCRIPTS-->
...

<!--SCRIPTS END-->

    section is generated by sails. Try just to put your link after , so it will be like

    <!--SCRIPTS-->
<script src="/js/dependencies/sails.io.js"></script>
<script src="/js/dependencies/bower_components/jquery/dist/jquery.min.js"></script>
<script src="/js/dependencies/bower_components/angular/angular.min.js"></script>
<script src="/js/dependencies/bower_components/angular-resource/angular-resource.min.js"></script>
<script src="/js/dependencies/bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
<script src="/js/dependencies/bower_components/moment/moment.js"></script>
<script src="/js/dependencies/application.js"></script>   
<!--SCRIPTS END-->
<script src="/js/dependencies/route.js"></script>