美文网首页
nuxt本地服务端口,端口占用

nuxt本地服务端口,端口占用

作者: Enhoo_38ca | 来源:发表于2021-05-21 18:22 被阅读0次

    因UI看效果的需要,开启本地服务实时更新,以达到更好的沟通。
    开启的基本方法:

    1.package.json当中添加配置

    缺点只能写死端口号,当遇到端口占用直接报错。

      "config": {
        "nuxt":{
          "host":"0.0.0.0",
          "port":"8099"
        }
      },
    

    2.使用Script跑命令

    这样可以实现,命令行控制端口号,但还是不够优秀。

    "scripts": {
        "dev": "nuxt --hostname 0.0.0.0 --port 8099 );
    "
      },
    //终端: npm run dev
    

    3.使用node-portfinder找到未占用端口,跑起来

    // npm i portfinder
    // npm i shelljs
    

    在脚本处新建port.js

    // port.js
    const portfinder = require('portfinder'); // 找到有效的 port
    const { exec } = require('shelljs'); // 执行 shell
    
    portfinder.basePort = 8099; // 最低的端口
    portfinder.highestPort = 9000; // 最高的端口
    
    async function getPort() {
      let port = await portfinder.getPortPromise(); // port 为可用端口
      exec(`nuxt --hostname 0.0.0.0 --port ${port}`); // 跑命令
    }
    getPort();
    
      "scripts": {
        "dev": "node ./port.js", // 脚本所在的目录
      },
    
    // npm run dev 大功告成
    

    后面会接着出 portfinder / shelljs 这两个实用包详情。

    相关文章

      网友评论

          本文标题:nuxt本地服务端口,端口占用

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