vuepress: vuepress dev: throws res.getHeader() is not a function

  • I confirm that this is an issue rather than a question.

Bug report

Version

  • vuepress@0.14.10
  • Reproduce same fault with node v10.9.0 AND node v8.11.4
  • Windows 10

Steps to reproduce

NOTE: This was a first time use of vuepress.

$ npm i -g vuepress
$ echo "# Some Stuff" >> README.md
$ vuepress dev

> VuePress dev server listening at http://localhost:8080/

Visit http://localhost:8080/ in browser

Server throws …

(node:14508) UnhandledPromiseRejectionWarning: TypeError: res.getHeader is not a function
    at processRequest (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\webpack-dev-middleware\lib\middleware.js:82:18)
    at ready (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\webpack-dev-middleware\lib\util.js:51:12)
    at handleRequest (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\webpack-dev-middleware\lib\util.js:167:5)
    at Promise (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\webpack-dev-middleware\lib\middleware.js:44:7)
    at new Promise (<anonymous>)
    at middleware (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\webpack-dev-middleware\lib\middleware.js:43:12)
    at Promise.all.Promise (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\koa-webpack\index.js:43:7)
    at new Promise (<anonymous>)
    at C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\koa-webpack\index.js:42:5
    at dispatch (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\koa\node_modules\koa-compose\index.js:42:32)
    at C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\@shellscape\koa-static\legacy\index.js:58:19
    at Generator.throw (<anonymous>)
    at step (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\@shellscape\koa-static\legacy\index.js:6:221)
    at _throw (C:\ProgramData\nvm\v10.9.0\node_modules\vuepress\node_modules\@shellscape\koa-static\legacy\index.js:6:455)
(node:14508) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:14508) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 63
  • Comments: 60 (3 by maintainers)

Commits related to this issue

Most upvoted comments

The dependency chain is webpack-serve -> koa-webpack -> webpack-dev-middleware, and it’s caused by the underlying webpack-dev-middleware@3.6.1, so If you’re a yarn user you can use resolutions for a temporary fix:

  "resolutions": {
    "webpack-dev-middleware": "3.6.0"
  }

While the npm user can re-install webpack-dev-middleware with a specific version:

npm install webpack-dev-middleware@3.6.0

When webpack-dev-middleware fixes the issue and publishes, the issue can be closed.

+64
ulivz on Mar 9, 2019

@edadams Sorry if my answer confused you, I didn’t have so much time at that point to dig down which dependency is the culprit.

Since @ulivz has found the exact module that caused the issue, you can override that module version in your package.json, you can read more about the yarn’s resolution docs here, https://yarnpkg.com/lang/en/docs/selective-version-resolutions/

What you want to do is to edit your package.json file, and add,

  "resolutions": {
    "webpack-dev-middleware": "3.6.0"
  }

And run yarn install again. Hope you got it fixed 😃

+12
abrahamdio on Mar 10, 2019 
> VuePress dev server listening at http://localhost:8081/
(node:50091) UnhandledPromiseRejectionWarning: TypeError: res.getHeader is not a function
    at processRequest (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:82:18)
    at ready (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/util.js:51:12)
    at handleRequest (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/util.js:167:5)
    at Promise (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:44:7)
    at new Promise (<anonymous>)
    at middleware (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:43:12)
    at Promise.all.Promise (/Users/fanmu/Desktop/Learning_blog/node_modules/koa-webpack/index.js:43:7)
    at new Promise (<anonymous>)
    at /Users/fanmu/Desktop/Learning_blog/node_modules/koa-webpack/index.js:42:5
    at dispatch (/Users/fanmu/Desktop/Learning_blog/node_modules/koa/node_modules/koa-compose/index.js:42:32)
    at /Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:58:19
    at Generator.throw (<anonymous>)
    at step (/Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:6:221)
    at _throw (/Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:6:455)
(node:50091) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:50091) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

How to deal with the error

the problem has been solved npm i webpack-dev-middleware@3.6.0

+9
fanmucc on Mar 11, 2019 
> VuePress dev server listening at http://localhost:8081/
(node:50091) UnhandledPromiseRejectionWarning: TypeError: res.getHeader is not a function
    at processRequest (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:82:18)
    at ready (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/util.js:51:12)
    at handleRequest (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/util.js:167:5)
    at Promise (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:44:7)
    at new Promise (<anonymous>)
    at middleware (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:43:12)
    at Promise.all.Promise (/Users/fanmu/Desktop/Learning_blog/node_modules/koa-webpack/index.js:43:7)
    at new Promise (<anonymous>)
    at /Users/fanmu/Desktop/Learning_blog/node_modules/koa-webpack/index.js:42:5
    at dispatch (/Users/fanmu/Desktop/Learning_blog/node_modules/koa/node_modules/koa-compose/index.js:42:32)
    at /Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:58:19
    at Generator.throw (<anonymous>)
    at step (/Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:6:221)
    at _throw (/Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:6:455)
(node:50091) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:50091) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

How to deal with the error

+9
fanmucc on Mar 11, 2019

As a quick and temporary fix you can download 0.x yarn.lock and install dependencies from there.

# root dir of your vuepress project
# replace yarn.lock file / create a new one from the above
rm -rf node_modules
yarn install

Edit: @ulivz has a better solution. See below.

+9
abrahamdio on Mar 10, 2019

@bnb Based on previous answers, (you could read for more details)

Assuming you’re using yarn, add this to your package.json,

"resolutions": {
    "webpack-dev-middleware": "3.6.0"
  },
"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  }

and yarn install again. Run via yarn docs:dev or yarn docs:build.

If you’re using npm, Run npm install webpack-dev-middleware@3.6.0 --save-dev in your local project folder. Add this to your package.json,

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  }

and run npm run docs:dev or npm run docs:build.

These solutions will install a new local dependency of webpack-dev-middleware@3.6.0, and before someone fixed the real root cause, you should be running with your package manager yarn docs:dev / npm run docs:dev, as this will use your local vuepress instead your global’s vuepress.

+6
abrahamdio on Mar 16, 2019

So for those of you having issues still with the fixes listed above, a team mate of mine figured out that the issue was having Vuepress installed globally. It appears that the fixes above are only applying to your local project directory and is not being applied to the global installation.

Following these instructions, I was able to get it to finally work:

  1. npm uninstall -g vuepress
  2. Run npm install webpack-dev-middleware@3.6.0 to install locally
  3. add "vuepress:dev": "vuepress dev" to your package.json file
  4. npm run vuepress:dev

You may want to add the resolutions code from above to your package.json as well but I was able to get it to run without: "resolutions": { "webpack-dev-middleware": "3.6.0" }

+5
mattcotter on Mar 20, 2019

I’m working at: 1、create package.json and don’t use global vuepress cli 2、install webpack-dev-middleware@3.6.0 in project 3、npm run docs:dev is working ex:

{
  "name": "testvuepress",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "vuepress": "^0.14.10"
  },
  "devDependencies": {
    "eslint": "^5.15.1",
    "eslint-config-airbnb-base": "^13.1.0",
    "eslint-plugin-import": "^2.16.0",
    "webpack-dev-middleware": "^3.6.0"
  }
}
+5
easonjim on Mar 15, 2019

I tried to remove node_modules ,add webpack-dev-middleware@3.6.0 to my package.json and reinstall all dependencies with npm,but ended up with the same error.Then I turn to yarn and finally get it work.So for those who are still struggling with this error,it is strongly recommended to give yarn a try

+3
HonmaMeikodesu on Mar 14, 2019

Can a temporary solution for the globally installed VuePress be to published a version with a pinned webpack-dev-middleware@3.6.0?

+2
bnb on Mar 23, 2019

I am using yarn, add this is my package.json run yarn install and yarn run docs:dev It work for me

{
  "name": "vuepress-test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "resolutions": {
    "webpack-dev-middleware": "3.6.0"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "vuepress": "^0.14.10"
  }
}
+2
loveyunk on Mar 17, 2019

Fixed at webpack/webpack-dev-middleware@56dc705 and released at webpack-dev-middleware@v3.6.2.

For now you can remove all of your hacking, just rm -rf node_modules and run npm install / yarn.

+1
ulivz on Apr 3, 2019

mac 10.13.6 npm install -D webpack-dev-middleware@3.6.0

+1
qietugou on Mar 30, 2019

why don’t use 1.x ? all these solutions I had tried but also made issues

+1
yxbysxcoco on Mar 26, 2019

采坑+1

(node:14088) UnhandledPromiseRejectionWarning: TypeError: res.getHeader is not a function

解决方法： 删除 node_modules, 使用yarn 重新安装依赖。

package.json
{
  "name": "test",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "devDependencies": {
    "vuepress": "^0.14.10",
    "webpack-dev-middleware": "3.6.0"
  },
    "resolutions": {
    "webpack-dev-middleware": "3.6.0"
  }
}
+1
Mr-wang007s on Mar 25, 2019

我尝试了以上所有的方法但是还是不行，不知道其他人有没有更好的解决方案。 （我尝试了以上所有方法，但我仍然不能。我不知道其他人是否有更好的解决方案。）

我尝试了以上所有的方法但是还是不行，不知道其他人有没有更好的解决方案。 （I tried all the above methods, but I still can’t. I don’t know if other people have better solutions.）

I followed the npm install -D webpack-dev-middleware@3.6.0 advice which can’t solved it

你是全局安装的吗？我先删除了全局的vuepress，然后本地安装就可以正常运行了。

+1
jiugeChen on Mar 18, 2019

Adding the info below to package.json and using yarn dev solved the issue for me.

Thanks to @kucukkanat

"resolutions": {
    "webpack-dev-middleware": "3.6.0"
  }
+1
KaanSK on Mar 16, 2019

Weird, that out of the box, it seemed to install v3.6.0 (I checked in the node_modules src for the package) but I still got the error.

I followed the npm install -D webpack-dev-middleware@3.6.0 advice which has now solved it.

+1
webdevisme on Mar 16, 2019

Just started my first VuePress and ran into the same UnhandledPromiseRejectionWarning: TypeError: res.getHeader is not a function error. This is in a fresh project with nothing in it.

Running npm install -D webpack-dev-middleware@3.6.0 like above fixed it for me (I’m using npm). I didn’t have to do anything else.

Kinda strange to get this right out of the box… I’m sure it’ll be addressed soon.

+1
johndatserakis on Mar 16, 2019

Ah, that seems to be the difference – in your previous comment --save-dev was omitted 👍

+1
bnb on Mar 15, 2019

Thanks, @abrahamdio. FWIW, it looks like the upstream fixes linked in the OP have already landed/been closed but the problem still seems to exist 😬

+1
bnb on Mar 15, 2019

I can confirm that simply adding this to package.json:

  "webpack-dev-middleware": "3.6.0"
},

and then reinstalling dependencies with yarn install allowed it to work.

+1
Morgul on Mar 13, 2019

Recommend actually reading this thread. There are several solutions.

On Mon, Mar 11, 2019 at 1:16 AM fanmucc notifications@github.com wrote:

VuePress dev server listening at http://localhost:8081/ (node:50091 http://localhost:8081/(node:50091) UnhandledPromiseRejectionWarning: TypeError: res.getHeader is not a function at processRequest (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:82:18) at ready (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/util.js:51:12) at handleRequest (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/util.js:167:5) at Promise (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:44:7) at new Promise (<anonymous>) at middleware (/Users/fanmu/Desktop/Learning_blog/node_modules/webpack-dev-middleware/lib/middleware.js:43:12) at Promise.all.Promise (/Users/fanmu/Desktop/Learning_blog/node_modules/koa-webpack/index.js:43:7) at new Promise (<anonymous>) at /Users/fanmu/Desktop/Learning_blog/node_modules/koa-webpack/index.js:42:5 at dispatch (/Users/fanmu/Desktop/Learning_blog/node_modules/koa/node_modules/koa-compose/index.js:42:32) at /Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:58:19 at Generator.throw (<anonymous>) at step (/Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:6:221) at _throw (/Users/fanmu/Desktop/Learning_blog/node_modules/@shellscape/koa-static/legacy/index.js:6:455) (node:50091) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1) (node:50091) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

How to deal with the error

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/vuejs/vuepress/issues/1417#issuecomment-471374521, or mute the thread https://github.com/notifications/unsubscribe-auth/AAu-2kRSjQpWwaq4tAIR76uOkHLMPnZgks5vVa5dgaJpZM4bkbSW .

+1
ara303 on Mar 11, 2019
Read more comments on GitHub
← vuepress: Vuepress building is too slow ?!
vuepress: @vuepress/google-analytics does not add tracking code as window is undefined? →