Vue npm运行服务从随机端口开始

vue.js Vue.js

村村神无猴子

2020-03-13

我正在尝试在端口8080上运行Vue,但无法使其正常工作。我刚刚使用创建了一个全新的项目,vue create .并使用运行了该项目npm run serve,这会在随机端口上启动该应用程序。

第一次尝试

无需任何其他配置即可运行npm run serve

$ npm run serve

> vue-demo@0.1.0 serve /Users/ne/projects/vue-demo
> vue-cli-service serve

 INFO  Starting development server...
Starting type checking service...
Using 1 worker with 2048MB memory limit
 98% after emitting CopyPlugin

 DONE  Compiled successfully in 4294ms                                                                                                              3:21:35 PM

No type errors found
Version: typescript 3.5.3
Time: 4267ms

  App running at:
  - Local:   http://localhost:20415/
  - Network: http://192.168.178.192:20415/

  Note that the development build is not optimized.
  To create a production build, run npm run build.

因此,我首先检查了该端口上是否正在运行另一个应用程序,lsof -i :8080但是没有结果。

第二次尝试

因此,第二个尝试是通过cli通过cli强制端口,该端口npm run serve -- --port 8080仍然在随机端口上启动了该应用程序,但在浏览器控制台中没有错误。

第三次尝试

接下来,我尝试在中配置应用程序vue.config.js

module.exports = {
  devServer: {
    open: process.platform === 'darwin',
    host: 'localhost',
    port: 8080, // CHANGE YOUR PORT HERE!
    https: false,
    hotOnly: false,
  },
};

两者都不起作用,甚至在浏览器控制台中引发异常:

15:25:20.889 :8080/sockjs-node/info?t=1566048320873:1 Failed to load resource: net::ERR_CONNECTION_REFUSED
15:25:20.910 client?81da:172 [WDS] Disconnected!
close @ client?81da:172
15:25:21.982 :8080/sockjs-node/info?t=1566048321978:1 Failed to load resource: net::ERR_CONNECTION_REFUSED
15:25:23.079 :8080/sockjs-node/info?t=1566048323075:1 Failed to load resource: net::ERR_CONNECTION_REFUSED
15:25:25.097 :8080/sockjs-node/info?t=1566048325091:1 Failed to load resource: net::ERR_CONNECTION_REFUSED
15:25:29.151 VM14:1 GET http://localhost:8080/sockjs-node/info?t=1566048329145 net::ERR_CONNECTION_REFUSED

package.json

我添加了package.json,因为这里可能会丢失一些东西。

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "test:unit": "vue-cli-service test:unit"
  },
  "dependencies": {
    "core-js": "^2.6.5",
    "vue": "^2.6.10",
    "vue-class-component": "^7.0.2",
    "vue-property-decorator": "^8.1.0",
    "vue-router": "^3.0.3",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "@types/jest": "^23.1.4",
    "@vue/cli-plugin-babel": "^3.10.0",
    "@vue/cli-plugin-eslint": "^3.10.0",
    "@vue/cli-plugin-typescript": "^3.10.0",
    "@vue/cli-plugin-unit-jest": "^3.10.0",
    "@vue/cli-service": "^3.10.0",
    "@vue/eslint-config-airbnb": "^4.0.0",
    "@vue/eslint-config-typescript": "^4.0.0",
    "@vue/test-utils": "1.0.0-beta.29",
    "babel-core": "7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "node-sass": "^4.9.0",
    "sass-loader": "^7.1.0",
    "ts-jest": "^23.0.0",
    "typescript": "^3.4.3",
    "vue-template-compiler": "^2.6.10"
  }
}

我想念什么?

第1473篇《Vue npm运行服务从随机端口开始》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

2个回答
小小猿 2020.03.13

大多数情况下,当同一端口上正在运行某些东西时,就会发生错误。但是,正如您上面提到的,您已经检查了它,但是上面没有任何内容。

您是否尝试过重新启动或关闭系统并重新运行服务器(如果在某些情况下不尝试运行服务器,请尝试一下)。

其次,如果您在package.json***享脚本的对象,将对您有所帮助。

我已经解决了您的问题,发现这篇文章可能会对您有所帮助。让我知道错误是否仍然存在。

逆天Stafan 2020.03.13

您可以通过放置临时回退portfinder

"resolutions": {
  "@vue/cli-service/portfinder": "1.0.21"
}

在您的package.json文件中,然后运行yarn install

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android