Nathaniel Harman
Nathaniel Harman

Reputation: 347

Inject dependencies into grunt serve index file

so i'm using bower for my packages and grunt serve is as far as i've gone with grunt, what i want to know is, just to save me the time.

how do i get grunt/bower to include what i need either from the command line (would be best for workflow) or using the .json file in the initial index.html file?

so in this case i've ran,

yo webapp(or mobile)
bower install topcoat --save
bower install jplayer --save
bower update
grunt serve

heres my json file

{
  "name": "imtoolbox",
  "version": "0.0.0",
  "dependencies": {
    "topcoat": "~0.8.0",
    "requirejs": "~2.1.4",
    "modernizr": "~2.6.2",
    "jquery": "~1.9.1",
    "jplayer": "~2.5.5"
  },
  "devDependencies": {}
}

my head

<link rel="stylesheet" href="styles/main.css">
        <!-- build:js scripts/vendor/modernizr.js -->
        <script src="bower_components/modernizr/modernizr.js"></script>
        <!-- endbuild -->

        <!-- build:css styles/vendor/topcoat/css/topcoat-mobile-light.min.css -->
        <link rel="stylesheet" href="styles/vendor/topcoat/css/topcoat-mobile-light.min.css">
        <!-- endbuild -->

my scripts

<!-- build:js scripts/main.js -->
        <script data-main="scripts/main" src="bower_components/requirejs/require.js"></script>
        <!-- endbuild -->

        <!-- build:js scripts/async-local-storage.js -->
        <script src="scripts/async.localStorage.js"></script>
        <script src="scripts/async.localStorage.examples.js"></script>
        <!-- endbuild -->

        <!-- build:js scripts/fullscreensnippet.js -->
        <script src="scripts/fullscreensnippet.js"></script>
        <!-- endbuild -->

        <!-- build:js scripts/fastclick.js -->
        <script src="scripts/fastclick.js"></script>
        <script src="scripts/fastclick.example.js"></script>
        <!-- endbuild -->

any help on this would be great it seams theres a lot of different answers online and having something that works would be sweet!

Upvotes: 0

Views: 825

Answers (1)

moramedia
moramedia

Reputation: 11

I think you're missing bower's wiring

<!-- build:js scripts/myscripts.js -->
<!-- bower:js -->
<script src="bower_components/jquery/jquery.js"></script>
<script src="bower_components/sass-bootstrap/dist/js/bootstrap.js"></script>
<!-- endbower -->
<!-- endbuild -->

Upvotes: 1

Related Questions