如何配置vue项目在localhost和network均可访问

1、首先在config文件下的index.js中修改host为(但此操作有bug,会导致localhost也变成0.0.0.0)

host: '0.0.0.0'

所以建议在package.json文件下“script”的“dev”后新增“-host 0.0.0.0”,即:

"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0",

2、设置启动后终端显示localhost和network访问地址:
修改build文件下的webpack.dev.conf.js文件中compilationSuccessInfo为如下内容:

compilationSuccessInfo: {
          // 修改启动后终端显示localhost和network访问地址
          messages: [
            `App runing at: `,
            `Local: http://localhost:${port}`,
            `Network: http://${require('ip').address()}:${port}`,
          ],
        },

3、启动项目即可

你可能感兴趣的:(前端,vue)