问题标签 [nuxtjs2]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
183 浏览

firebase - 如何在 nuxt 应用程序中为 Firebase 可调用函数配置生产 URL?

我有一个nuxt应用程序上传到 Firebase(作为云功能)。我还有一个我试图从应用程序调用的可调用函数。问题是它试图调用localhosturl 而不是生产的。

我的 Firebase 设置nuxt.config.js如下所示:

firebase.nuxt.org文档仅提及模拟器配置,但未提及生产。

我这样调用函数:

如何使功能在生产中使用正确的 url?

编辑:

这是package.json设置:

编辑2:

显然env.functionsURL应用正确,因为应用程序代码直接将此变量用于其他目的并且它可以正常工作!这是callable functions唯一一个由于某种原因没有收到要调用的相关生产 url。同时,代码中唯一出现 5001 端口的地方是:

  1. nuxt.config.js / env环境
  2. nuxt.config.js / modules / services / functions / emulatorPort环境
  3. service.functions.js自动添加的文件夹中的模块nuxt/firebase(我猜是通过 firebase.nuxtjs 吗?)。

该模块如下所示:

所以也许出于某种原因callable function认为它仍然应该使用模拟器设置?我怎么能阻止它?

调用模块的唯一位置是nuxt/firebase/index.js,如下所示:

这似乎确实不管环境如何,Firebase 的本机代码确实应用了相同的设置。我可以修改functionsService代码,但它似乎不是最佳解决方案,因为 Firebase 可能会在某些时候覆盖它,例如在构建或更新期间。或者可能是这些“本机”文件仅在开始时生成并且尽管在配置中进行了潜在更改(这是不正确的,但现在是正确的),但并未更新。

我怎样才能强制更改这些 Firebase 的文件以区分 prod 和 dev 环境并使它们安全地持续存在?可能nuxt.config.js / modules / services / functions /应该配置不同,但是如何?

0 投票
1 回答
127 浏览

vue.js - 如何以编程方式绑定 Nuxt/Vue 中的视频播放器 URL?

我正在寻找如何以编程方式绑定视频播放器网址的想法。我理解使用 img 和 doingv-for和 a的想法:src,但是我的视频的 url 被放入脚本的数据中。是否也可以绑定并使这些程序化?这是一个现在工作脚本的示例,但我只需手动将其替换为每个视频的组件。

上面的代码可以正常工作,但我需要为每个视频都有一个组件。然后在每个组件中放置相同的代码,但更改 m3u8 视频的 src 名称。理想情况下,我只想将 api 中的某些内容传递到 m3u8 的 src 并创建一个动态组件。问题是,我将如何制作这个动态组件?

我尝试了类似的方法,但无法在脚本中执行 :src 。

0 投票
1 回答
204 浏览

javascript - Nuxt 插件无法在功能块中访问 Vue 的“this”实例

所以我设法注入 hls.js 来使用 nuxtjs $root 元素和this

我是这样做的(hls.client.js):

和 nuxt.config.js

从字面上看,这很好用:-) 但我不能在 hls 事件中引用“this”。

所以我在这些事件中我不能使用 nuxtjs 'this',因为似乎有不同的范围?

我可以在这些事件中以某种方式获得“这个”nuxt 范围吗?

0 投票
2 回答
82 浏览

javascript - nuxtjs 切换由 v-for 循环生成的单个项目

我想创建一个简单的手风琴式结构,但不知何故我无法切换单个元素:

我将如何切换单个问题/答案块?我需要使用参考吗?

目前我可以切换所有元素......

我可以起草一个 Q/A 组件,然后在每个组件内部进行切换,但我认为这太过分了。

更新我正在处理以下数据结构:

0 投票
2 回答
225 浏览

laravel - 在每个 API 请求 nuxtJS 上接收 CORS 策略错误

我正在尝试运行 Laravel V8.14(后端)和 nuxtJS 2.15(前端)应用程序,但不幸的是,每个 API 请求(包括 SSR 请求)在使用 WAMP的本地计算机上都出现 CORS 策略错误

运行npm run dev所有内容都会编译并开始在 http://localhost:3000/ 上监听。当我尝试访问我的主页时,控制台或命令提示符上没有错误。但是 api 请求获取 CORS 策略错误。我已经尝试使用 nuxtJS 的 baseURL 和代理,但错误始终保持不变。我知道你不能同时拥有这两个

Laravel cors.php配置文件

nuxt.config.js 文件

Laravel内核.php

确切的错误

所有 API 请求都在路由文件夹中的 laravel api.php 中

已经 5 天了,我陷入了这个困境,主要是我用代理改变了东西,希望它下次能工作。甚至完全全新安装了 nuxtJS(删除了 node_modules 和 package.json.lock),但没有运气。

任何帮助将不胜感激。

0 投票
0 回答
22 浏览

javascript - 在 nuxtjs2 中将 javascript 类作为插件注入时出错

我正在尝试将 javascript 类作为插件注入。

我收到以下错误: 无法读取未定义的属性“日志”

要注入的类:

插入:

用法:

更新:

看起来插件在客户端创建的钩子中不可用,为什么?如果我将插件转换为服务器客户端插件,它就可以工作。

0 投票
0 回答
115 浏览

ios - Nuxtjs2 iPhone 键盘未在 PWA 上显示

我在使用 NuxtJS 时遇到了 iPhone 默认键盘的问题。

当我在主屏幕上安装了 2 个 PWA 应用程序时发生了这种情况。键盘不见了(例如,请参阅我的屏幕截图)。

重现问题的步骤

  1. 安装 2 个 PWA 应用程序(将它们保存到主屏幕)
  2. 打开第一个应用程序,专注于输入字段(我的网站)=> 键盘显示正确
  3. 单击返回主页按钮,返回主屏幕
  4. 打开第二个应用程序,专注于输入字段(在本例中我使用 Pinterest)=> 此步骤中缺少键盘

它完美地在Android上运行......

示例截图

这个问题的源代码,仅供参考

0 投票
1 回答
29 浏览

nuxt.js - NuxtJS Access 在 nuxtjs 注入方法中安装了 vue 插件

我想将 VueToast 包安装为插件,并使用 nuxt 插件添加全局辅助方法。如下所示,我在 5-11 行之间安装插件。我需要在第 18 行访问 $toast 道具。但是我无法访问 $toast 道具。如何在注入方法中访问 $toast 道具?

Nuxt 版本:2.15.8 Vue 版本:2.6.14 Vue Toast 通知版本:0.6.2 Vue Toast 通知链接:https ://github.com/ankurk91/vue-toast-notification/tree/v1.x

toast-plugin.js

nuxt.config.js

0 投票
0 回答
10 浏览

vuejs2 - 如何在 nuxt 2 中集成这个 tinymce 编辑器

设置“@tinymce/tinymce-vue@^3” - 用于 vue 2

但是这个 TinyCloud 包装器加载 TinyCloud,让它使用自托管版本?

有正常的人类指令吗?

ps:我正在尝试将所有这些都放在nuxt 2中

0 投票
0 回答
7 浏览

vuejs2 - Nuxt 生成失败并在 vue dist 文件中未定义

我正准备从 Nuxt.js 2 项目部署我的第一个静态应用程序。

虽然静态路​​由生成得很好,但我的动态路由却不是。一旦我记得它们被隐藏在我的下拉菜单中 - duhh - 我创建了一个 /generate 页面,该页面使用 nuxt-link 组件呈现我的所有动态路由。我的假设是爬虫应该找到 /generate/index.vue 页面和上面的链接,然后爬取这些。

它没有。

然后我注意到塞巴斯蒂安肖邦的评论提到在生成静态应用程序时应该启用 SSR。好的。所以我重新启用了 SSR,但我只遇到了错误。我想出了一对,但最新的一个让我难住了。

自我未在 vue dist 文件中定义

一些谷歌搜索没有发现任何相关的线索——或者至少我不认为它们是相关的——所以我需要“全球开发者”团队的帮助。

此错误是否表明 Vue 本身存在问题?我不会在我的应用程序代码中的任何地方使用“自我”……嗯?

干杯,杰里米