The vue project is packaged as APP and static resources are displayed normally but API can't request data operations

After the Vue project is packaged from Hbuild to APP, static files are displayed normally, but data is not requested as it was during development.

Why is this? Because APP is not cross-domain, there is no cross-domain 1 theory.

When we were developing, js transmitted data or communicated between different domains, so we set up proxies for the project to cross domains

index. js under config

Like this

proxyTable: {
 '/api':{
  target: 'http://XXX/xxx/v3',
  changeOrigin: true,
  pathRewrite: {
   '^/api': ''
  }
 }
}

It's true to do this at development time, but we don't have to set up this cross-domain when packaging, comment out this cross-domain directly before packaging, and then change the API request address to absolute address. For example

let SwipeImg = () => axios({
 // url: 'api/basic/advert/lists',
 url: 'http://xxx.xxx.xx.xx/api/v3/basic/advert/lists',
 params: {
  auth_key: key
 }
})

After the modification, the APP data will be displayed normally after being packaged through Hbuild

It should be noted here that I put the packaged APP in the night god simulator, and the data display is still abnormal, but it is normal to put it in my mobile phone, which should be paid attention to

Additional knowledge: vue project can't see the page content after packaging

The vue project packaging command is:

npm run build

If the index. html page can't be seen after packaging, the path may be wrong, and the config/index. js file needs to be modified

As follows:

 build: {
  // Template for index.html
  index: path.resolve(__dirname, '../dist/index.html'),

  // Paths
  assetsRoot: path.resolve(__dirname, '../dist'),
  assetsSubDirectory: 'static',
  assetsPublicPath: './',// Here is the place to modify, add here . 
..........
}