vitepress 构建报错 window is not defined

[wulisensen]

在vitepress 中引用，构建时报错

build error: ReferenceError: window is not defined at /Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:17:38752 at /Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:17:38714 at e.exports (/Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:17:39216) at Object. (/Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:17:22624) at t (/Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:7:316) at Object. (/Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:17:40271) at t (/Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:7:316) at /Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:7:699 at /Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:7:710 at /Users/wuguangsen/self/blog-vitepress/node_modules/valine/dist/Valine.min.js:7:81 error Command failed with exit code 1.

[ZhongxuYang]

You can use dynamic import() and call in mounted function.

like this:

const initValine = async () => {
  const { default: Valine } = await import('valine');
  const valineOptions = {
    el:'#vcomments',
    appId: '******',
    appKey: '******',
    path: window.location.pathname,
  };

  new Valine(valineOptions)
};

onMounted(() => {
  initValine()
})

[tkzt]

You can use dynamic import() and call in mounted function.

like this:

const initValine = async () => {
  const { default: Valine } = await import('valine');
  const valineOptions = {
    el:'#vcomments',
    appId: '******',
    appKey: '******',
    path: window.location.pathname,
  };

  new Valine(valineOptions)
};

onMounted(() => {
  initValine()
})

It works to me. Great thanks :D