nuxt cannot run dev

[denlly]

I follow the installation, https://boilerplates.js.org/docs/nuxt-installation

npm run dev

but, I got

× Client
  Compiled with some errors in 34.46s

× Server
  Compiled with some errors in 32.42s


 ERROR  Failed to compile with 18 errors                        friendly-errors 10:15:58


 ERROR  in C:\demos\Frontend-Boilerplates-nuxt\client\middleware\config.ts

[tsl] ERROR in C:\demos\Frontend-Boilerplates-nuxt\client\middleware\config.ts(24,111)
      TS2322: Type '0' is not assignable to type '{ label: number; sent: () => any; trys: any[]; ops: any[]; }'.
                                                                friendly-errors 10:15:58

 ERROR  in C:\demos\Frontend-Boilerplates-nuxt\client\middleware\interceptors.ts

[tsl] ERROR in C:\demos\Frontend-Boilerplates-nuxt\client\middleware\interceptors.ts(24,111)
      TS2322: Type '0' is not assignable to type '{ label: number; sent: () => any; trys: any[]; ops: any[]; }'.
                                                                friendly-errors 10:15:58

 ERROR  in C:\demos\Frontend-Boilerplates-nuxt\client\services\container.builder.ts

[tsl] ERROR in C:\demos\Frontend-Boilerplates-nuxt\client\services\container.builder.ts(8,51)
      TS2345: Argument of type '() => void' is not assignable to parameter of type 'new (...args: any[]) => {}'.
  Type '() => void' provides no match for the signature 'new (...args: any[]): {}'.

environment：[email protected],[email protected],win10_x64

How to resolve.

[CKGrafico]

Hello @denlly sorry to don't give you the best experience working with the boilerplates.
I've downloaded the nuxt branch as zip in a new computer and is working.
Seems that there is an error with typings, but cannot reproduce it.

Can you try a clean install npm install -f ?
Can you also copy paste the package.lock.json to here to compare with mine?

On the other side, my implementation of the "fetch" polyfills is not the best and is going to work better with axios, but I hope that is not related with your problem

[denlly]

Hello @CKGrafico
I am sorry .
I try to run npm install -f , but it's useless.

tsconfig.js

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "es7"
    ],
    "module": "es2015",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "noImplicitAny": false,
    "noImplicitThis": false,
    "strictNullChecks": false,
    "removeComments": true,
    "suppressImplicitAnyIndexErrors": true,
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "allowJs": true,
    "paths": {
      "~/*": ["./client/*"]
    }
  }
}

package.json

 "dependencies": {
    "@nuxtjs/toast": "^3.0.2",
    "body-parser": "^1.18.3",
    "bootstrap": "^4.2.1",
    "bootstrap-vue": "^2.0.0-beta",
    "cookie-parser": "^1.4.3",
    "cross-env": "^5.2.0",
    "dotenv": "^6.2.0",
    "express": "^4.16.3",
    "express-session": "^1.15.6",
    "fetch-intercept": "^2.3.1",
    "inversify": "^5.0.1",
    "morgan": "^1.9.1",
    "node-fetch": "^2.3.0",
    "normalize-scss": "^7.0.1",
    "nuxt": "^2.0.0",
    "nuxt-class-component": "^1.2.1",
    "nuxt-i18n": "^5.4.4",
    "nuxt-sass-resources-loader": "^2.0.5",
    "reflect-metadata": "^0.1.12",
    "v-click-outside": "^2.0.2",
    "vue-property-decorator": "^7.2.0",
    "vuex-class": "^0.3.1",
    "whatwg-fetch": "^3.0.0"
  },
  "devDependencies": {
    "@types/chai": "^4.1.7",
    "@types/fetch-mock": "^6.0.4",
    "@types/mocha": "^5.2.5",
    "@types/node": "^10.12.12",
    "@types/sinon-chai": "^3.2.1",
    "chai": "^4.2.0",
    "chai-as-promised": "^7.1.1",
    "chai-fetch-mock": "^2.0.0",
    "chromedriver": "^2.44.1",
    "fetch-mock": "^7.2.5",
    "fontmin": "^0.9.7-beta",
    "karma": "^3.1.3",
    "karma-chrome-launcher": "^2.2.0",
    "karma-coverage": "^1.1.2",
    "karma-mocha": "^1.3.0",
    "karma-sinon-chai": "^2.0.2",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-spec-reporter": "0.0.32",
    "karma-webpack": "^4.0.0-rc.5",
    "mocha": "^5.2.0",
    "nightwatch": "^0.9.21",
    "node-sass": "^4.10.0",
    "node-stringify": "^0.2.1",
    "nodemon": "^1.11.0",
    "sass-loader": "^7.1.0",
    "selenium-server": "^3.141.59",
    "sinon": "^7.1.1",
    "sinon-chai": "^3.3.0",
    "stylelint": "^9.9.0",
    "stylelint-config-standard": "^18.2.0",
    "stylelint-order": "^2.0.0",
    "stylelint-processor-html": "^1.0.0",
    "stylelint-scss": "^3.4.1",
    "ts-loader": "^5.3.1",
    "tslint": "^5.11.0",
    "tslint-loader": "^3.5.4",
    "typescript": "^3.2.1",
    "uglifyjs-webpack-plugin": "^2.0.1",
    "vuex-mock-store": "0.0.6",
    "webpack-dev-server": "^3.1.10"
  },

I don't know that Is it problem with tsconfig? I guess.. :)

[CKGrafico]

You're using the correct tsconfig that's weird :/ send me the packages.lock

[CKGrafico]

I think that the problem are the versions, the Nuxt template is not update to last version, we will update
@Denly I've hided some of your comments because were too long

[aaronlippold]

I am seeing this error as well. What can we do to help get this updated and working again?

[CKGrafico]

Not really sure about how much Nuxt changed since the version supported but we can start updating the packages in package.json

[CKGrafico]

ncu report

 @nuxtjs/toast                   ^3.0.2  →    ^3.3.0 
 body-parser                    ^1.18.3  →   ^1.19.0 
 bootstrap                       ^4.2.1  →    ^4.3.1 
 bootstrap-vue              ^2.0.0-beta  →    ^2.0.4 
 cookie-parser                   ^1.4.3  →    ^1.4.4 
 cross-env                       ^5.2.0  →    ^6.0.3 
 dotenv                          ^6.2.0  →    ^8.2.0 
 express                        ^4.16.3  →   ^4.17.1 
 express-session                ^1.15.6  →   ^1.17.0 
 node-fetch                      ^2.3.0  →    ^2.6.0 
 nuxt                            ^2.0.0  →   ^2.10.2 
 nuxt-class-component            ^1.2.1  →    ^1.3.0 
 nuxt-i18n                       ^5.4.4  →    ^6.3.0 
 reflect-metadata               ^0.1.12  →   ^0.1.13 
 v-click-outside                 ^2.0.2  →    ^2.1.5 
 vue-property-decorator          ^7.2.0  →    ^8.3.0 
 vuex-class                      ^0.3.1  →    ^0.3.2 
 @types/chai                     ^4.1.7  →    ^4.2.4 
 @types/fetch-mock               ^6.0.4  →    ^7.3.1 
 @types/mocha                    ^5.2.5  →    ^5.2.7 
 @types/node                  ^10.12.12  →  ^12.12.7 
 @types/sinon-chai               ^3.2.1  →    ^3.2.3 
 chromedriver                   ^2.44.1  →   ^78.0.1 
 fetch-mock                      ^7.2.5  →    ^7.7.3 
 fontmin                    ^0.9.7-beta  →    ^0.9.8 
 karma                           ^3.1.3  →    ^4.4.1 
 karma-chrome-launcher           ^2.2.0  →    ^3.1.0 
 karma-coverage                  ^1.1.2  →    ^2.0.1 
 karma-webpack              ^4.0.0-rc.5  →    ^4.0.2 
 mocha                           ^5.2.0  →    ^6.2.2 
 nightwatch                     ^0.9.21  →    ^1.2.4 
 node-sass                      ^4.10.0  →   ^4.13.0 
 nodemon                        ^1.11.0  →   ^1.19.4 
 sass-loader                     ^7.1.0  →    ^8.0.0 
 sinon                           ^7.1.1  →    ^7.5.0 
 stylelint                       ^9.9.0  →   ^11.1.1 
 stylelint-config-standard      ^18.2.0  →   ^19.0.0 
 stylelint-order                 ^2.0.0  →    ^3.1.1 
 stylelint-scss                  ^3.4.1  →   ^3.12.1 
 ts-loader                       ^5.3.1  →    ^6.2.1 
 tslint                         ^5.11.0  →   ^5.20.1 
 typescript                      ^3.2.1  →    ^3.7.2 
 uglifyjs-webpack-plugin         ^2.0.1  →    ^2.2.0 
 vuex-mock-store                  0.0.6  →     0.0.7 
 webpack-dev-server             ^3.1.10  →    ^3.9.0 

[CKGrafico]

I've upgraded the dependencies and now the app is compiling but there is an error when I run it, I've to search more info about nuxt "Unknown middleware"
I've created a branch for this nuxt-upgrade https://github.com/CKGrafico/Frontend-Boilerplates/tree/nuxt-upgrade