Static GitHub Issues

[1174] use a third lib in dev mode run ok and production throw DOMException

prev: Can't execute $emit tag <a> inside <nuxt-link>
next: [rc1] alias ~ is all broken.

at dev mode , only a warn: clientside and server content is not equal but in production( npm run build && npm start ) in console it throws

nuxt.js Cannot load components DOMException HierarchyRequestError: "Node cannot be inserted at the specified point in the hierarchy" code: 3 nsresult: 0x80530003 location: http://localhost:3000/_nuxt/vendor.bundle.6dd843ba30f5c0b80ac1.js:6

so, what happens?

nuxt ver: 1.0.0-alpha.5 third lib: element-ui v1.4.0

plugins/element-ui:

import Vue from 'vue'
import { Dialog } from 'element-ui'

if (process.BROWSER_BUILD) {
  Vue.use(Dialog)
  // Vue.use(require('element-ui')) // all components
}

nuxt.config.js:

module.exports = {
  head: {
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: `dev ${dev}-${this.dev}` }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
      ...(dev ? [] : cdnLink)
    ],
    script: [
      ...(dev ? [] : cdnScript)
    ]
  },
  css: [
    'normalize.css',
    ...(dev ? devUseCSS : []),
    { src: '~assets/stylus/main.styl', lang: 'stylus' }
  ],
  // plugins: ['~plugins/vuex-router-sync.js'],
  plugins: ['~plugins/vuex-router-sync.js', '~plugins/element-ui.js'], // { src: '~plugins/element-ui.js', ssr: false}
  build: {
    vendor: ['axios'],
    // vendor: ['axios' ,'element-ui'],
    babel: {
      plugins: [['component', [{
        libraryName: 'element-ui',
        styleLibraryName: 'theme-default'
      }]]]
    }
  },
  loading: { color: '#41B883' }
}

2017-07-27 20-08-47

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1031">#c1031</a>)</em></sub></div>