After vue is packaged, a file json with configurable html data is generated, and the pit record is recorded

Static resources are placed in the public, so that the json folder can be displayed when packaging

 

The require acquisition used at the beginning can be used when debugging in vscode, but the json packaged by npm cannot change the content of html

let screenDataJson = require("../../public/json/screenData.json"); 

Then I searched for a method on the Internet. It seems that I tried axios to obtain it. I forgot which method. In short, 404 cannot obtain the address, because the address cannot be written as above, and the public should be replaced ("../.././config.json")

And before I had time to try this method, my colleague helped me solve it, that is, convert the json into a js file and put it in the html to update it in real time

First add const XXXX = in the json you wrote

 Then put <script type="text/javascript" src="./json/config.json"></script> into the html file in the public

Back to the developed vue file, you can use configJSON directly