未捕获的SyntaxError:Modernizr

时间:2016-05-22 22:35:16

标签: javascript angularjs node.js modernizr

我想了解更多nodejs,angularjs和mongodb。我正在开设这个在线课程https://scotch.io/tutorials/making-mean-apps-with-google-maps-part-i,因为我想了解如何使用前面提到的工具使用谷歌地图。但是,我在使用modernizr的谷歌crome上有一个错误,我不知道如何解决。它显示了第一行代码:#!/ usr / bin / env node。有没有人知道如何解决这种情况?

我已经阅读了所有Uncaught语法错误:...在stackoverflow中但我无法找到它。

我的代码是上面链接的复制和粘贴。

文件夹结构:

MapApp
-- app // Backend 
---- model.js 
---- routes.js 

-- public // Frontend
---- index.html 
---- js
------ app.js 
------ addCtrl.js 
------ gservice.js 
---- style.css

-- server.js // Express Server
-- package.json

这是index.html

<!doctype html>
<!-- Declares meanMapApp as the starting Angular module -->
<html class="no-js" ng-app="meanMapApp">
<head>
    <meta charset="utf-8">
    <title>Edwin MEAN Map</title>
    <meta name="description" content="An example demonstrating Google Map integration with MEAN Apps">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- CSS -->
    <link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.css"/>
    <link rel="stylesheet" href="style.css"/>
    <!-- Holder JS -->
    <script src="../bower_components/holderjs/holder.js"></script>
    <!-- Google Maps API -->
    <script src="https://maps.googleapis.com/maps/api/js?key=A VALID GOOGLE KEY "></script>
    <!-- Modernizr -->
    <script src="../bower_components/modernizr/bin/modernizr"></script>
    <!-- JS Source -->
    <script src="../bower_components/jquery/dist/jquery.js"></script>
    <script src="../bower_components/angular/angular.js"></script>
    <script src="../bower_components/angular-route/angular-route.js"></script>
    <script>
        var map;
        function initMap() {
            map = new google.maps.Map(document.getElementById('map'), {
                center: {lat: -34.397, lng: 150.644 },
                zoom: 8
            });
        }
    </script>
    <script src="../bower_components/angularjs-geolocation/dist/angularjs-geolocation.min.js"></script>
        <!-- Angular Scripts -->
    <script src="js/app.js"></script>
    <script src="js/addCtrl.js"></script>
    <script src="js/gservice.js"></script>
</head>
<body ng-controller="addCtrl">
<div class="container">
    <div class="header">
        <ul class="nav nav-pills pull-right">
            <li active><a href="">Join the Team</a></li>
            <li disabled><a href="">Find Teammates</a></li>
        </ul>
        <h3 class="text-muted">The Edwin's MEAN MapApp</h3>
    </div>
    <!-- Map and Side Panel -->
    <div class="row content">
        <!-- Google Map -->
        <div class="col-md-7">
            <div id="map" style="width:645px; height:645px"></div>
        </div>
        <!-- Side Panel -->
        <div class="col-md-5">
            <div class="panel panel-default">
                <!-- Panel Title -->
                <div class="panel-heading">
                    <h2 class="panel-title text-center">Join the Scotch Team! <span class="glyphicon glyphicon-map-marker"></span></h2>
                </div>
                <!-- Panel Body -->
                <div class="panel-body">
                    <!-- Creates Form (novalidate disables HTML validation, Angular will control) -->
                    <form name ="addForm" novalidate>
                        <!-- Text Boxes and Other User Inputs. Note ng-model binds the values to Angular $scope -->
                        <div class="form-group">
                            <label for="username">Username <span class="badge">All fields required</span></label>
                            <input type="text" class="form-control" id="username" placeholder="OldandGold" ng-model="formData.username" required>
                        </div>
                        <label class="radio control-label">Gender</label>
                        <div class="radio">
                            <label>
                                <input type="radio" name="optionsRadios" id="radiomale" value="Male" ng-model="formData.gender">
                                Male
                            </label>
                        </div>
                        <div class="radio" required>
                            <label>
                                <input type="radio" name="optionsRadios" id="radiofemale" value="Female" ng-model="formData.gender">
                                Female
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                                <input type="radio" name="optionsRadios" id="radioother" value="What's it to ya?" ng-model="formData.gender">
                                What's it to ya?
                            </label>
                        </div>
                        <div class="form-group">
                            <label for="age">Age</label>
                            <input type="number" class="form-control" id="age" placeholder="72" ng-model="formData.age" required>
                        </div>
                        <div class="form-group">
                            <label for="language">Favorite Language</label>
                            <input type="text" class="form-control" id="language" placeholder="Fortran" ng-model="formData.favlang" required>
                        </div>
                        <div class="form-group">
                            <label for="latitude">Latitude</label>
                            <input type="text" class="form-control" id="latitude" value="39.500" ng-model="formData.latitude" readonly>
                        </div>
                        <div class="form-group">
                            <label for="longitude">Longitude</label>
                            <input type="text" class="form-control" id="longitude" value="-98.350" ng-model="formData.longitude" readonly>
                        </div>
                        <div class="form-group">
                            <label for="verified">HTML5 Verified Location? <span><button class="btn btn-default btn-xs"><span class="glyphicon glyphicon-refresh"></span></button></span></label>
                            <input type="text" class="form-control" id="verified" placeholder= "Nope (Thanks for spamming my map...)" ng-model="formData.htmlverified" readonly>
                        </div>
                        <!-- Submit button. Note that its tied to createUser() function from addCtrl. Also note ng-disabled logic which prevents early submits.  -->
                        <button type="submit" class="btn btn-danger btn-block" ng-click="createUser()" ng-disabled="addForm.$invalid">Submit</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <hr/>
    <!-- Footer -->
    <div class="footer">
        <p class="text-center"><span class="glyphicon glyphicon-check"></span> Created by Ahmed Haque for Scotch IO -
            <a href="https://scotch.io/">App Tutorial</a> | <a href="https://github.com/afhaque/MeanMapAppV2.0">Github Repo</a></p>
    </div>
</div>
</body>
</html>

===================================== =====这是我的server.js ===

// Dependencies
// -----------------------------------------------------
var express         = require('express');
var mongoose        = require('mongoose');
var port            = process.env.PORT || 3000;
var morgan          = require('morgan');
var bodyParser      = require('body-parser');
var methodOverride  = require('method-override');
var app             = express();

// Express Configuration
// -----------------------------------------------------
// Sets the connection to MongoDB
mongoose.connect("mongodb://localhost/MeanMapApp");

// Logging and Parsing
app.use(express.static(__dirname + '/public'));                 // sets the static files location to public
app.use('/bower_components',  express.static(__dirname + '/bower_components')); // Use BowerComponents
app.use(morgan('dev'));                                         // log with Morgan
app.use(bodyParser.json());                                     // parse application/json
app.use(bodyParser.urlencoded({extended: true}));               // parse application/x-www-form-urlencoded
app.use(bodyParser.text());                                     // allows bodyParser to look at raw text
app.use(bodyParser.json({ type: 'application/vnd.api+json'}));  // parse application/vnd.api+json as json
app.use(methodOverride());

// Routes
// ------------------------------------------------------
 require('./app/routes.js')(app);

// Listen
// -------------------------------------------------------
app.listen(port);
console.log('App listening on port ' + port);

提前谢谢你,

0 个答案:

没有答案