Comments (6)
moh1434
commented on May 29, 2024
1
OK I found it in main.ts
my main.ts:
// register vue composition api globally
import { ViteSSG } from 'vite-ssg'
import generatedRoutes from 'virtual:generated-pages'
import { setupLayouts } from 'virtual:generated-layouts'
import { createWebHashHistory } from 'vue-router'
import App from './App.vue'
// windicss layers
import 'virtual:windi-base.css'
import 'virtual:windi-components.css'
// your custom styles here
import './styles/main.css'
// windicss utilities should be the last style import
import 'virtual:windi-utilities.css'
// windicss devtools support (dev only)
import 'virtual:windi-devtools'
const routes = setupLayouts(generatedRoutes)
// https://github.com/antfu/vite-ssg
export const createApp = ViteSSG(
App,
{
routes,
history: createWebHashHistory(),
base: import.meta.env.BASE_URL,
},
(ctx) => {
// install all modules under `modules/`
Object.values(import.meta.globEager('./modules/*.ts')).map(i => i.install?.(ctx))
},
)
This works only on dev mode.
If i write pnpm build i get:
[vite-ssg] Build for server...
vite v2.7.10 building SSR bundle for production...
✓ 52 modules transformed.
.vite-ssg-temp/manifest.webmanifest 0.38 KiB
.vite-ssg-temp/main.mjs 60.86 KiB
.vite-ssg-temp/assets/style.defb76cf.css 21.61 KiB
[vite-ssg] An internal error occurred.
[vite-ssg] Please report an issue, if none already exists: https://github.com/antfu/vite-ssg/issues
(node:115654) UnhandledPromiseRejectionWarning: ReferenceError: location is not defined
at createWebHashHistory (/mnt/2C586E41586E0A42/TODO_list/vitesse/node_modules/.pnpm/[email protected][email protected]/node_modules/vue-router/dist/vue-router.cjs.js:737:5)
at file:///mnt/2C586E41586E0A42/TODO_list/vitesse/.vite-ssg-temp/main.mjs:1255:12
at ModuleJob.run (internal/modules/esm/module_job.js:152:23)
at async Loader.import (internal/modules/esm/loader.js:166:24)
at async build (/mnt/2C586E41586E0A42/TODO_list/vitesse/node_modules/.pnpm/[email protected]_97bac1ad760e801e4df55702908e73e1/node_modules/vite-ssg/dist/node/cli.cjs:180:44)
at async Object.handler (/mnt/2C586E41586E0A42/TODO_list/vitesse/node_modules/.pnpm/[email protected]_97bac1ad760e801e4df55702908e73e1/node_modules/vite-ssg/dist/node/cli.cjs:294:3)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:115654) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 3)
(node:115654) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
I noticed that history: createWebHistory(), also doesn't work with pnpm build
[vite-ssg] An internal error occurred.
[vite-ssg] Please report an issue, if none already exists: https://github.com/antfu/vite-ssg/issues
(node:116363) UnhandledPromiseRejectionWarning: ReferenceError: window is not defined
at useHistoryStateNavigation (/mnt/2C586E41586E0A42/TODO_list/vitesse/node_modules/.pnpm/[email protected][email protected]/node_modules/vue-router/dist/vue-router.cjs.js:505:35)
at createWebHistory (/mnt/2C586E41586E0A42/TODO_list/vitesse/node_modules/.pnpm/[email protected][email protected]/node_modules/vue-router/dist/vue-router.cjs.js:597:31)
at file:///mnt/2C586E41586E0A42/TODO_list/vitesse/.vite-ssg-temp/main.mjs:1255:12
at ModuleJob.run (internal/modules/esm/module_job.js:152:23)
at async Loader.import (internal/modules/esm/loader.js:166:24)
at async build (/mnt/2C586E41586E0A42/TODO_list/vitesse/node_modules/.pnpm/[email protected]_97bac1ad760e801e4df55702908e73e1/node_modules/vite-ssg/dist/node/cli.cjs:180:44)
at async Object.handler (/mnt/2C586E41586E0A42/TODO_list/vitesse/node_modules/.pnpm/[email protected]_97bac1ad760e801e4df55702908e73e1/node_modules/vite-ssg/dist/node/cli.cjs:294:3)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:116363) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 3)
(node:116363) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
from vitesse.
antfu
commented on May 29, 2024
Please read the docs for vue-router-next, ViteSSG bypass your configure to it via the second args
from vitesse.
rainmanhhh
commented on May 29, 2024
what is "the second args"? vite defineConfig? didn't find any router related args in vite.config.ts
from vitesse.
rainmanhhh
commented on May 29, 2024
OK I found it in main.ts
from vitesse.
Zehir
commented on May 29, 2024
@moh1434 I have the same result when I build. Did you find a solution for that in between ?
from vitesse.
rainmanhhh
commented on May 29, 2024
// eslint-disable-next-line import/order
import { modules } from './importModules'
import type { ViteSSGContext } from 'vite-ssg'
import { ViteSSG } from 'vite-ssg'
import generatedRoutes from 'virtual:generated-pages'
import { setupLayouts } from 'layouts-generated'
import { createWebHashHistory } from 'vue-router'
import 'default-passive-events'
import App from './App.vue'
const routes = setupLayouts(generatedRoutes)
// https://github.com/antfu/vite-ssg
// noinspection JSUnusedGlobalSymbols
export const createApp = ViteSSG(
App,
// {routes, history: undefined} will cause 'location is undefined' error with ssr
import.meta.env.VITE_APP_SSR ? { routes } : { routes, history: createWebHashHistory() },
(ctx) => {
Object.entries(modules).forEach(([k, v]: [string, any]) => {
if (import.meta.env.DEV) console.debug(`imported module ${k}:`, v)
share(k, registerModule(ctx, v))
})
function getModuleName(key: string) {
const p2 = key.lastIndexOf('.')
return p2 < 0 ? key.substring(10) : key.substring(10, p2) // length of './modules/' is 10
}
function registerModule(context: ViteSSGContext, module: Record<string, Record<string, any>>) {
const exported = module.default
if (typeof exported === 'function') {
const plugin = exported(context)
if (typeof plugin === 'function' || typeof plugin?.install === 'function') context.app.use(plugin)
return plugin
}
}
function share(key: string, module: any) {
if (module !== undefined) window.shared[getModuleName(key)] = module
}
window.shared.app = ctx.app
},
)importModules.ts:
// if you need import other files, change suffix below
export const modules = import.meta.globEager('./modules/*.{ts,css}')
from vitesse.
Related Issues (20)
- When I use markdown as the page, the code block shows both themes, because is it an example? HOT 3
- tsconfig.json configuration in Vue project
- Composable syntax HOT 1
- [bug ] : can't force my website visitors to get the new version HOT 3
- Font inconsistency between local run and online demo HOT 1
- 能放开对.d.ts文件的格式化不
- tsconfig error HOT 1
- carbon icon integration with VS Code HOT 1
- Consider using `unplugin-vue-router` HOT 1
- Language preferences are not preserved HOT 1
- I can‘t use ref in the vue^3.3.4and vite^4.4.5 HOT 2
- Page `hi` is missing dynamic route parameters
- layout feature doesn't work HOT 3
- Is there a plan to support jsx? HOT 3
- Format the contents of "<route lang='yaml'></route>" on save
- route layout not working
- Can anyone tell me how to use .env in this templete? HOT 2
- The eslint of this project is not working in vscode. HOT 2
- Running in subdirectory giving page not found.
- How to solve the console preload crossorigin warning problem HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vitesse.