Webpack无法加载json文件，如何找到本地json文件并使用AngularJS使用http.get加载

Question

我正在使用ES6语法的AngularJs，我试图从ApiService.js加载本地themes.json文件

  getThemesOptions() {
    this.$http.get('src/app-builder/p3-modal/themes.json')
    .success(function(data) {
      console.log(data);
    })
    .error(function() {

    });

我的文件结构：

src/
  app-builder/
    p3-modal/
      themes.json
  service/
    apiService/
       apiService.js

从控制台看来，它成功找到了文件，但是输出非常奇怪，

因为themes.json看起来像这样：

我正在使用Webpack运行应用程序，访问应用程序的URL通常不是本地主机，而是使用http://10.98.142.233:8080/o2/search/ab代替，我不知道是什么原因引起的

请告诉我如何使用AngularJs ES6和webpack从本地正确加载json文件。

谢谢！

这是网络标签。

Answer 1

不，实际上发生的事情是无法找到的JSON文件和的WebPack开发服务器路由404回你的index.html，这是你在控制台中看到什么。 之所以触发成功回调，是因为从技术上讲，它不是404，而是200 OK。

只要Webpack开发服务器从src文件夹上方的目录中提供内容，您所做的就应该可以正常工作。 我猜可能不是这样。

Answer 2

您的浏览器位置是www.google.com/image ，然后当您调用ajax时，请求访问的网址是www.google.com/image/${url}但是如果在您的网址前加一个斜杠，则类似于/src/app..以及请求的网址，例如www.google.com/${url}