美文网首页
Vue Nuxt项目启动后可以在局域网内访问

Vue Nuxt项目启动后可以在局域网内访问

作者: 木头就是我呀 | 来源:发表于2020-01-07 14:05 被阅读0次
    • 在调试项目的时候发现只能使用在电脑上使用localhost or 127.0.0.1进行访问,此时,package.json中script.dev中是如下配置
    "dev": "cross-env MODE=dev nuxt",
    
    • 最后的版本是如下所示(可以用)
    "dev": "cross-env HOST=0.0.0.0 PORT=3333 MODE=dev nuxt",
    

    经过查询资料得知,该方式是nuxt官方提供的配置形式,不仅有上面使用HOSTorPORT方式,还有以下几种:

    1 作为命令参数直接传递

    nuxt --hostname myhost --port 3333
    

    或者

    "scripts": {
      "dev": "nuxt --hostname myhost --port 3333"
    }
    

    2 在 nuxt.config.js 中配置:

    export default {
      server: {
        port: 8000, // default: 3000
        host: '0.0.0.0' // default: localhost
      }
      // other configs
    }
    

    3 使用 NUXT_HOST 和 NUXT_PORT env 变量

    "scripts": {
      "dev": "NUXT_HOST=0.0.0.0 NUXT_PORT=3333 nuxt"
    }
    
    • 注意: 为了更好的跨平台开发支持,您可以使用 cross-env 依赖包。

    安装依赖:

    npm install --save-dev cross-env
    

    配置cross-env:

    "scripts": {
      "dev": "cross-env NUXT_HOST=0.0.0.0 NUXT_PORT=3333 nuxt"
    }
    

    4.使用HOST和PORT env变量

    "scripts": {
      "dev": "HOST=0.0.0.0 PORT=3333 nuxt"
    }
    

    5.在 package.json 中配置 nuxt :

    "config": {
      "nuxt": {
        "host": "0.0.0.0",
        "port": "3333"
      }
    },
    "scripts": {
      "dev": "nuxt"
    }
    

    相关文章

      网友评论

          本文标题:Vue Nuxt项目启动后可以在局域网内访问

          本文链接:https://www.haomeiwen.com/subject/jgdractx.html