Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

360
Vistas
I would like to know how to install and use mathlive in NuxtJS

please help me I'd like to know why it doesn't work or if I'm doing it wrong.

I npm i mathlive to get input. And following the implementation of the nuxt plugins in the documentation doesn't work.

nuxt.config.js

export default {
  // Global page headers: https://go.nuxtjs.dev/config-head
  head: {
    title: 'Nuxtnumer',
    htmlAttrs: {
      lang: 'en',
    },
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' },
      { name: 'format-detection', content: 'telephone=no' },
    ],
    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],
  },

  // Global CSS: https://go.nuxtjs.dev/config-css
  css: [],

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: ['./plugins/mathlive-vue.js'],

  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [
    // https://go.nuxtjs.dev/bootstrap
    'bootstrap-vue/nuxt',
    // https://go.nuxtjs.dev/axios
    '@nuxtjs/axios',
  ],

  // Axios module configuration: https://go.nuxtjs.dev/config-axios
  axios: {
    // Workaround to avoid enforcing hard-coded localhost:3000: https://github.com/nuxt-community/axios-module/issues/308
    baseURL: '/',
  },

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {
    transpile: ['mathlive-vue']
  },
}

file mathlive-vue.js in directory plugins

import Vue from 'vue';
import * as Mathlive from 'mathlive';
import Mathfield from 'mathlive/dist/vue-mathlive.mjs'

Vue.use(Mathlive,Mathfield)

Error:

ERROR Failed to compile with 1 errors friendly-errors 19:26:11

ERROR in ./node_modules/mathlive/dist/vue-mathlive.mjs friendly-errors 19:26:11

Module parse failed: Unexpected token (2:342) friendly-errors 19:26:11
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | /** MathLive 0.69.11 */

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

I haven't used mathlive specifically, but I read your question and suspected that:

transpile: ['mathlive-vue']

Should be:

transpile: ['vue-mathlive']

becase the output complains about ./node_modules/mathlive/dist/vue-mathlive.mjs specifically.

I spun up a quick app and was able to recreate your error by copying your transpile config. Switching to vue-mathline resolved the error for me.

In case you (or anyone else who finds this question) are wondering what's going on- mathlive code uses ES modules, which cannot be executed in Node (the server side of your Nuxt app). Therefore you need to let Nuxt know that those files should be transpiled (made compatible with node) in order for them to work.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda