title: javascript returning 404 error and uncaught reference
body: <p><img src="https://i.stack.imgur.com/vQBnk.png" alt="enter image description here">I got a code where it labels the globe, the problem is that when I try to run it in the local server it is giving me a 404 error and uncaught reference error. The code is as below:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;style&gt;
      @import url(bucket.css);
  &lt;/style&gt;
  &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"       type="text/javascript"&gt;&lt;/script&gt; 
  &lt;script src="require.js" data-main="main"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="cesiumContainer" class="fullSize"&gt;&lt;/div&gt;
  &lt;div id="loadingOverlay"&gt;&lt;h1&gt;Loading...&lt;/h1&gt;&lt;/div&gt;
  &lt;div id="toolbar"&gt;&lt;/div&gt;
  &lt;script&gt;
  require(['Cesium', 'Button'], function(Cesium, Button)
  {
      "use strict";
  
      function addLabel(scene, ellipsoid) {
          Sandcastle.declare(addLabel);   // For highlighting in Sandcastle.
          var labels = new Cesium.LabelCollection();
          labels.add({
              position : ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57)),
              text     : 'Philadelphia'
          });
          scene.getPrimitives().add(labels);
      }
  
      function setLabelFont(scene, ellipsoid) {
          Sandcastle.declare(setLabelFont);   // For highlighting in Sandcastle.
          var labels = new Cesium.LabelCollection();
          labels.add({
              position  : ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57)),
              text      : 'Philadelphia',
              // CSS font-family
              font      : '24px Helvetica',
              fillColor : { red : 0.0, blue : 1.0, green : 1.0, alpha : 1.0 },
              outlineColor : { red : 0.0, blue : 0.0, green : 0.0, alpha : 1.0 },
              outlineWidth : 2,
              style : Cesium.LabelStyle.FILL_AND_OUTLINE
          });
          scene.getPrimitives().add(labels);
      }
  
      function setLabelProperties(scene, ellipsoid) {
          Sandcastle.declare(setLabelProperties); // For highlighting in Sandcastle.
          var labels = new Cesium.LabelCollection();
          var l = labels.add({
              position : ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57)),
              text     : 'Philadelphia'
          });
  
          l.setPosition(ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.10, 39.57, 300000.0)));
          l.setScale(2.0);
          scene.getPrimitives().add(labels);
      }
  
      function addLabelsInReferenceFrame(scene, ellipsoid) {
          Sandcastle.declare(addLabelsInReferenceFrame);  // For highlighting in Sandcastle.
          var center = ellipsoid.cartographicToCartesian(Cesium.Cartographic.fromDegrees(-75.59777, 40.03883));
          var labels = new Cesium.LabelCollection(undefined);
          labels.modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(center);
          labels.add({
              position : new Cesium.Cartesian3(0.0, 0.0, 0.0),
              text     : 'Center'
          });
          labels.add({
              position : new Cesium.Cartesian3(1000000.0, 0.0, 0.0),
              text     : 'East'
          });
          labels.add({
              position : new Cesium.Cartesian3(0.0, 1000000.0, 0.0),
              text     : 'North'
          });
          labels.add({
              position : new Cesium.Cartesian3(0.0, 0.0, 1000000.0),
              text     : 'Up'
          });
          scene.getPrimitives().add(labels);
      }
  
      function createButtons(widget) {
          var ellipsoid = widget.centralBody.getEllipsoid();
          var scene = widget.scene;
          var primitives = scene.getPrimitives();
  
          new Button({
              label: 'Add label',
              onClick: function() {
                  primitives.removeAll();
                  addLabel(scene, ellipsoid);
                  Sandcastle.highlight(addLabel);
              }
          }).placeAt('toolbar');
  
          new Button({
              label: 'Set font',
              onClick: function() {
                  primitives.removeAll();
                  setLabelFont(scene, ellipsoid);
                  Sandcastle.highlight(setLabelFont);
              }
          }).placeAt('toolbar');
  
          new Button({
              label: 'Set properties',
              onClick: function() {
                  primitives.removeAll();
                  setLabelProperties(scene, ellipsoid);
                  Sandcastle.highlight(setLabelProperties);
              }
          }).placeAt('toolbar');
  
          new Button({
              label: 'Add labels in reference frame',
              onClick: function() {
                  primitives.removeAll();
                  addLabelsInReferenceFrame(scene, ellipsoid);
                  Sandcastle.highlight(addLabelsInReferenceFrame);
              }
          }).placeAt('toolbar');
      }
  
      var widget = new Cesium.CesiumWidget('cesiumContainer');
  
      createButtons(widget);
      addLabel(widget.scene, widget.centralBody.getEllipsoid());
  
      Sandcastle.finishedLoading();
  });
  
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The error am getting is as follows:</p>
  
  <p>1) <code>GET http://localhost/Source/Widgets/CesiumWidget/CesiumWidget.css 404 (Not Found)</code> </p>
  
  <pre><code>2) Uncaught ReferenceError: require is not defined 
  </code></pre>
  
  <p>Can someone tell me what is wrong? I do not understand where the CesiumWidget.css file is being invoked in the code. So it would be a lot helpful if someone can guide me.</p>
  
  <p>I tried adding the require js . But now its giving me one more error.</p>
  
  <p>3) Uncaught SyntaxError: Unexpected end of input </p>
  
  <p>Check the image, why am i getting that error in that line. The error which its showing is no way related to whats written in the line. </p>