I'm having real trouble getting my JS to work on this very simple Foundation/jQuery website. Nothing fancy, just a good old fashioned HTML page. On the Brunch side of things everything is compiling and files are being generated. The problem is that the javascript isn't running in the browser. No error messages – just not executing (i think). Look below and you'll see the console.log() but it's not returning anything in the web inspector
Package.json
{
"name": "your-app",
"description": "Description",
"author": "Your Name",
"version": "0.0.1",
"repository": {
"type": "git",
"url": ""
},
"scripts": {
"start": "brunch watch --server"
},
"dependencies": {
"autoprefixer": "^5.2.0",
"babel-brunch": "^5.1.2",
"browser-sync-brunch": "0.0.9",
"brunch": "^2.4.2",
"css-brunch": "^1.7.0",
"foundation-sites": "^6.2.0",
"javascript-brunch": "^1.7.1",
"jquery": "^1.12.1",
"motion-ui": "^1.2.2",
"postcss-brunch": "^0.5.0",
"sass-brunch": "^1.8.11",
"scut": "^1.4.0"
}
}
Brunch-config.coffee
exports.config =
npm:
enabled: true
globals:
$: 'jquery'
jQuery: 'jquery'
Foundation: 'foundation-sites'
files:
javascripts:
joinTo:
'js/app.js': /^app/
'js/vendor.js': /^node_modules/
stylesheets:
joinTo: 'css/app.css'
plugins:
sass:
options:
includePaths: [
'node_modules/foundation-sites/scss'
'node_modules/motion-ui/src'
'node_modules/scut/dist'
]
postcss:
processors: [
require('autoprefixer')({browsers: ['last 2 versions', 'ie >= 9']})
]
public/app.js
$(document).foundation();
console.log("it works");
index.html
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Hi</title>
<link rel="stylesheet" href="css/app.css">
</head>
<body>
hi
<script src="/js/vendor.js"></script>
<script src="/js/app.js"></script>
</body>
</html>
