Не удалось найти местоположение файла url

Я локально разрабатываю одностраничное приложение.

Я не могу загрузить HTML файл в качестве шаблона, используя простую настраиваемую директиву в Angularjs. Если я попытаюсь использовать raw html с использованием атрибута template: он работает просто отлично, но у меня есть более 400 строк кода, которые мне нужно использовать в этом шаблоне, и как только я попытаюсь использовать templateUrl: ничего не загружается. Я пробовал как 30 возможных путей, включая копирование HTML файла во множество разных мест, таких как C: /my-customer.html, в отчаянной попытке, вот моя структура проекта:

    App--
        |
        css
        |
        img
        |
        js--
           |
           main.js
           |
           foundation.js
           |
           my-customer.html
        |
        templates--
                  |
                  my-customer.html
        |
        bcf.html
        |
        fluidType.html
        |
        start.html
        |
        my-customer.html

Сохраняя это просто, я использую пример из угловых документов, вот мой код для директивы (внутри main.js с моим контроллером):

app.directive('myCustomer', function() {
  return {
    templateUrl: 'my-customer.html'
  };
});

снова я пробовал пути как: ../my-customer.html../templates/my-customer.html и т.д., но ничего не работает для templateUrl: я нахожусь в окнах без локального веб-сервера, если это помогает.

Вот некоторые ошибки консоли, но как новичок, не уверенный, что они означают, у меня есть чувство, что мне нужно запустить веб-сервер и проанализировать через http.

 XMLHttpRequest cannot load file:///C:/Users/Dylan/Google%20Drive/PA/Dev/Grossing%20App/templates/my-customer.html. Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, https, chrome-extension-resource.
angular.js:11594 Error: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'file:///C:/Users/Dylan/Google%20Drive/PA/Dev/Grossing%20App/templates/my-customer.html'.
    at Error (native)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:87:261
    at m (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:83:133)
    at f (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:80:366)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:112:276
    at l.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:126:84)
    at l.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:123:195)
    at l.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:126:362)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:17:448
    at Object.e [as invoke] (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:37:96)angular.js:11594 (anonymous function)
angular.js:11594 Error: [$compile:tpload] http://errors.angularjs.org/1.3.8/$compile/tpload?p0=templates%2Fmy-customer.html
    at Error (native)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:6:416
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:137:65
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:112:276
    at l.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:126:84)
    at l.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:123:195)
    at l.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:126:362)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:17:448
    at Object.e [as invoke] (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:37:96)
    at d (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:17:369)

Новое в Angularjs. Я ударил стену в проекте, и теперь я полностью застрял.

Ответ 1