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

因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 这两个实用包详情。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容