CODEWITHSUNDEEP
vue.jsvuepress
Eric_Ou
Eric_Ou

Reputation: 9

How should i import defaultTheme "@vuepress/theme-default" correctly?

I am now using vuepress to launch my personal blog, for building up a vuepress project, i used npm to install

However, when I tried to apply those packages to my config.js file and ran my vue-press site locally, an error said that there is a syntax error

Named export 'defaultTheme' not found. The requested module '@vuepress/theme-default' is a CommonJS module, which may not support all module.exports as named exports.

import { viteBundler } from "@vuepress/bundler-vite";
import { defaultTheme } from "@vuepress/theme-default";
import { defineUserConfig } from "vuepress";

export default defineUserConfig({
  title: "My Blog",
  description: "A blog about my life and learning",
  theme: defaultTheme({
    navbar: [
      { text: "Home", link: "/" },
      { text: "About", link: "/about/" },
    ],
  }),
  bundler: viteBundler(), 
});

I imported those packages followed the official docs from vuepress's website, how should I change my code to make it work? Thank you very much.

I tried to change the code following the hint

exports as named exports. CommonJS modules can always be imported via the default export, for example using:

import pkg from '@vuepress/theme-default'; const { defaultTheme } = pkg;"

but it didn't make sense and brought new problem which is

TypeError: defaultTheme is not a function

Upvotes: 0

Views: 80

Answers (0)

Related Questions