The vue cli 3.x version has made great changes to the construction of the entire project. There is no original config folder, no dev.env.js and prod.dev.js. We need to configure webpack and we need to manually configure the project. Create a vue.config.js file in the root directory
For example, we want to request an api through axios in the component, and the mock data is in our local index.json file under public/static/mock: ( note that vue cli3 can no longer access the local static in the static directory equal to src The resources are all migrated to the public directory, that is, the static folder that was previously equal to the src directory can be accessed normally by moving it to the public directory. For example, at this time, we can use the browser http://localhost:8080/static /mock/index.json to access the local index.json file ) In
this way, data can be obtained:
but if we want to access through the following api request, it will definitely not work.
So we need a request forwarding mechanism, vue- cli3 needs us to configure in vue.config.js:
const path = require('path')
module.exports = {
devServer: {
proxy: {
'/api': {
target: 'http://localhost:8080',
pathRewrite: {
'^/api': '/static/mock'
}
}
}
}
}
Save after configuration, and then need to restart the service, it's ok