如何在Nuxt.js中编辑main.js文件？

Question

如何在Nuxt.js中编辑main.js文件？

vue.jswebpackextjsnuxt.js

8

我需要将ExtJS WebComponents与Nuxt.js集成。根据关于将ExtJS与Vue.js集成的Sencha文档，我需要按照以下方式编辑src/main.js文件：

/*global Ext*/
import Vue from 'vue'
import App from './App.vue'
import '@sencha/ext-web-components/lib/ext-panel.component';

Ext.onReady(function() {
  new Vue({
    render: h => h(App)
  }).$mount('#app')
});

Nuxt.js 怎么做呢？

- shpindler

首先，Sencha是否支持SSR？ - Aldarund

@Aldarund，我无论如何都使用SPA模式，这在这种情况下重要吗？ - shpindler

我认为现在不可能在Nuxt中创建和挂载应用程序。我不确定Sencha为什么要这样做，但是如果在Nuxt插件中使用await可能已经足够了。 - Aldarund

我正在尝试做完全相同的事情 - 在 Nuxt.js 应用程序中使用 Ext JS Web 组件。在生成的目录“ .nuxt”中，生成了一个 server.js 文件，执行渲染函数。我尝试通过编辑 npm 模块 @nuxt/vue-app/template/server.js 来直接覆盖该文件，并将渲染函数包装在 Ext.onReady 中并导入一个 panel ext-web-component，这似乎起作用了。我现在正在寻找正确的方法来覆盖 Nuxt 生成的 server.js 代码。 - Larry Ball

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- nyagolova · Accepted Answer

你可以使用一个插件轻松解决这个问题。我之前在处理打印方面的问题时也遇到过同样的情况，以下是我的解决方法：

1. 在plugins文件夹下，我创建了一个名为printHtml.js的文件，并在其中添加了以下内容：

import Vue from 'vue';
import VueHtmlToPaper from 'vue-html-to-paper';

Vue.use(VueHtmlToPaper);

2. 然后在nuxt.config.js文件中，我只需添加：

  plugins: [
    '~plugins/printHtml.js'
  ],

就是这样啦。 :) 我能在所有组件中使用包函数。你也可以在ExtJS中做到同样的事情。