@vesp/mmx-frontend

MMX Frontend

This is a part of MMX initiative - the Modern MODX approach.

The port of Vesp frontend designed for quick development of modern UI in MODX manager.

Install

npm i @vesp/mmx-frontend

How to use

First you need to import and use default config in your vite.config.ts with mandatory namespace parameter:

import withMmx from '@vesp/mmx-frontend/config'

const config = {} // Optional Vite parameters to merge with default config
export default withMmx('mmx-extra', config)

Then you can import and use createMmx function in you mgr.js file:

import {createApp} from 'vue'
import {createRouter, createWebHashHistory} from 'vue-router'
import {createMmx} from '@vesp/mmx-frontend'
import App from './mgr/app.vue'
import routes from '~pages'
import './mgr/scss/index.scss'

const router = createRouter({
  history: createWebHashHistory(),
  routes,
})

document.addEventListener('DOMContentLoaded', () => {
  createApp(App)
    .use(router)
    .use(createMmx({namespace: 'mmx-extra'}))
    .mount('#mmx-extra-root')
})