在 vue 组件的 laravel 中导入 json 文件

Question

我正在尝试在我的 vue 组件中导入一个 json 文件，但它给出了这个错误

错误 ./~/buble-loader?{"objectAssign":"Object.assign"}!./~/vue-loader/lib/selector.js?type=script&index=0!./resources/assets/src/App. Vue 未找到模块：错误：无法解析“assets/incomingData.json” '/var/www/html/mac/resources/assets/src'

脚本：

import jsonData from 'assets/incomingData.json'

export default {
  name: 'app',
  data () {
    return {
      entryData: jsonData,
      outputData: ''
    }
  },
  created () {
    this.$store.commit('setEntryData', this.entryData['bundle'])
    this.$store.commit('setTargetRate', this.entryData.targetNetRate)
  },
  beforeMount () {
    this.$store.dispatch('calculate').then(res => {
      this.outputData = this.$store.getters.getCalculatedData
    })
  }
}

文件夹结构：

package.json

有什么建议可以解决这个问题吗？

Answer 1

assets 文件夹与您的 App.vue 文件（您从中导入 json 文件）处于同一级别。

为了从同一级别导入某些内容，请以 ./ 开始导入路径

import jsonData from './assets/incomingData.json'

如果你不使用./，webpack 将尝试在node_modules 中查找名为“assets”的包，而不是文件夹。