javascript - vue-clin project, dist folder after npm run build, index.html cannot obtain its own data through json, mock

Question

The project npm run dev and post-build tests are all fine. Now when I open the post-build dist folder index.html, the following error appears

Is it because the data and content my project relies on are all mocked through json files. After the build, the json data is not packaged into the dist folder, so the data cannot be requested? How to deal with it

Project directory,

Mock data in build/dev-server.js

/数据mock
var appData = require('../data.json');
var seller = appData.seller;
var goods = appData.goods;
var ratings = appData.ratings;

var apiRouters = express.Router();
apiRouters.get('/seller',function(req,res){
  res.json({
    errno:0,
    data:seller
  })
})

apiRouters.get('/goods',function(req,res){
  res.json({
    errno:0,
    data:goods
  })
})

apiRouters.get('/ratings',function(req,res){
  res.json({
    errno:0,
    data:ratings
  })
})


app.use('/api',apiRouters)
//数据mock

---

Answer 1

The api you use should use a relative path, so you need to open the http service and start the project after dist. You may use ./ or /, and then open the file directly, and the path will be read as the path of your computer's hard disk.

Answer 2

The error message is cross-domain