在 nuxt.config.js 中未调用 extendRoutes function

Question

I've generated a store with Vue-Storefront , which uses Nuxt , and in the Layout and Routing documentation page, it is recommended to use extendRoutes as such:

require("isomorphic-fetch");
import webpack from "webpack";
const platformENV = process.env.NODE_ENV !== "production" ? "http" : "https";
const config = {
// here ------------------------------
  router: {
    extendRoutes(routes, resolve) {
      routes.push({
        name: "custom",
        path: "/test",
        component: resolve(__dirname, "pages/Category.vue"),
      });
    },
  },
// here ------------------------------
  ...
};

export default config;

The problem is that the extendRoutes is never called as no console log is triggered in it, and I'm not sure how I can go around this issue. The route not being created or renamed, it routes to the 404 page. I'm linking some parts of my package.json if that can help:

 "dependencies": {
    "@nuxt/image": "0.6.0",
    "@nuxtjs/pwa": "^3.3.5",
    "@nuxtjs/sitemap": "^2.4.0",
    "@nuxtjs/style-resources": "^1.0.0",
    "@storefront-ui/vue": "^0.12.0",
    "@vue-storefront/shopify": "^1.1.2",
    "@vue-storefront/middleware": "2.5.6",
    "@vue-storefront/nuxt": "2.5.6",
    "@vue-storefront/nuxt-theme": "2.5.6",
    "cookie-universal-nuxt": "^2.1.3",
    "core-js": "^3.19.1",
    "isomorphic-fetch": "^2.2.1",
    "nuxt": "^2.13.3",
    "@nuxtjs/i18n": "^7.2.1",
    "vee-validate": "^3.2.3",
    "vue-scrollto": "^2.17.1",
    "@nuxtjs/device": "^2.1.0",
    "ipx": "0.9.1"
  },
  "devDependencies": {
    "@nuxt/types": "^2.13.3",
    "@nuxt/typescript-build": "^2.0.0",
    "@vue/test-utils": "^1.0.0-beta.27",
    "babel-jest": "^24.1.0",
    "cypress": "^9.1.0",
    "ejs": "^3.0.2",
    "jest": "^27.4.3",
    "lint-staged": "^11.1.2",
    "start-server-and-test": "^1.14.0",
    "vue-jest": "^4.0.0-0"
  }

If anyone went through the same issue, has an idea, please let me know.

Answer 1

I have found an answer after trying to get rid of parts of the code like @kissu commented. The problem comes from "./modules/cms/build" , in the buildModules in nuxt.config.js , this line calls the build script of the cms that's been integrated, which replaces the router.extendRoutes function and makes its own routes.

buildModules: [
    // to core
    "./modules/cms/build",
    "@nuxtjs/composition-api/module",
...

I hope this helps someone out there !