Skip to content

feat: Support SSR#177

Open
kagol wants to merge 1 commit into
WickyNilliams:masterfrom
kagol:master
Open

feat: Support SSR#177
kagol wants to merge 1 commit into
WickyNilliams:masterfrom
kagol:master

Conversation

@kagol
Copy link
Copy Markdown

@kagol kagol commented Feb 22, 2022

@viljamis
When I use enquire.js in a Vite project, the following error was reported when building production package:

✓ building client + server bundles...
✖ rendering pages...
build error:
 ReferenceError: window is not defined

I found that the reason for the error was that the MediaQueryDispatch method in the mediaquerydispatch.js file don't make judgments about the client environment.

When in the SSR situation, the code is running in nodeJS environment, no window variables, so the error will be reported.

I fixed the issue by adding

if (typeof window === 'undefined') {
  return;
}

It works well, please merge this PR and release a new version.

Thanks! Best wishs for you!

@kagol
Copy link
Copy Markdown
Author

kagol commented Feb 22, 2022

@viljamis
You can reproduce this problem by following these steps:

Step 1: Create Vite project and install deps

pnpm create vite vite-demo-enquire -- --template=vue-ts
pnpm i vitepress enquire.js

Step 2: Create docs/index.md

Create file docs/index.md

Hello enquire.js

Step 3: Configure vitepress, import enquire.js and use it

Create file docs/.vitepress/config.ts

const config = {
  title: 'enquire.js'
}

export default config

Create file docs/.vitepress/theme/index.ts

import Theme from 'vitepress/dist/client/theme-default'

// import enquire.js and use it
import * as enquire from 'enquire.js'
console.log('enquire:', enquire)

export default {
  ...Theme
}

Step 4: Add docs:build and build docs

Add docs:build script to package.json

  "scripts": {
    "dev": "vite",
    "build": "vue-tsc --noEmit && vite build",
    "docs:dev": "vitepress dev docs",

    // Added
    "docs:build": "vitepress build docs",

    "preview": "vite preview"
  },

And run build:docs

pnpm docs:build

Then the issue is reported as follows:

✓ building client + server bundles...
✖ rendering pages...
build error:
 ReferenceError: window is not defined

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant