Nuxt — 10

typescript - 使用 vuex-module-decorators 的 nuxtServerInit

在 Nuxt 中使用这种方法：https://github.com/championswimmer/vuex-module-decorators#accessing-modules-with-nuxtjs

store/index.ts：

import { Store } from 'vuex' import { initialiseStores } from '~/utils/store-accessor' const initializer = (store: Store<any>) => initialiseStores(store) export const plugins = [i

阅读更多 →

typescript - VS Code 中注入属性的 Nuxt ts 类型

我正在像这样将属性注入到 Nuxt 的 TS 上下文中：

import Vue from 'vue'; import { errorService } from '~/services/error'; import { Plugin } from '@nuxt/types' const services: Plugin = (context, inject) => { inject('errorService', Vue.observable(errorService)) } export default services

然后我有类型文件 ~/plugins.d.ts

import Vue from 'vue'; import { ErrorService } from '~/services/error'; declare module 'vue/types/v

阅读更多 →

typescript - 如何在 nuxt.js 中使用 chart.js？

我做了一个小应用来确认如何在 Nuxt.js 中使用 chart.js。我最近项目的语言是 TypeScript，所以我尝试用 TypeScript 编写我的代码。我也使用了 Nuxt.js 作为框架。我参考了这个网站。但我的示例代码出现了错误。

首先，我将图表文件制作成了 .vue 文件。我的图表组件在 Nuxt.js 中创建了 components 目录。但在这段代码中，@Prop 出现了错误。错误信息和代码如下。

“属性 'chartData' 没有初始化器，并且在构造函数中没有被明确分配。”

阅读更多 →

typescript - 在 nuxt 启动时预加载数据到存储

我正在使用 Nuxt 开发一个应用，并且我在 nuxtServerInit 中预加载一些内容并将其放入 store。这没问题，也没有任何问题。

我有很多其他项目也使用同样类型的初始预加载——所以我开始认为，把逻辑放到一个模块里是个好主意，这样我所有其他的项目只需将模块添加到 nuxt.config.js，store 就会被预填充……我开始创建这个模块，却发现此时无法访问 store，我说得对吗？

我尝试了 nuxt.hook('ready', (nuxt) => {...}，但是回调中的 nuxt 参数没有 store 引用。

阅读更多 →

vue.js - Nuxt + TypeScript 类型在布局和插件中不起作用

我在 TS 中是新手，我也想在布局中使用类型，但如图所示，当我给 popups 属性添加类型时，typescript-build 返回错误“Syntax Error: Unexpected token”。

在 pages 中它工作正常。在 layout 和 plugins 的 ts 文件中它不起作用。

简化版不起作用的 VUE 文件如下。

<template> <div id="wrapper" class="d-flex no-gutters"> <Nuxt/> </div> </template> <script type="ts"> import {Component, Vue} from 'nuxt-property-decorator' @Co

阅读更多 →

nuxt.js - 如何在“Nuxt TypeScript”项目中指定 TypeScript 服务器端入口点的编写？

在我看到的基于 JavaScript 的 Nuxt 项目示例中，服务器入口位于 server/index.js，这是它的默认代码（针对 Express.js 框架的情况）：

const express = require('express') const consola = require('consola') const { Nuxt, Builder } = require('nuxt') const app = express() // Imp

阅读更多 →

javascript - 在 Nuxt.js 中使用 TypeScript 的接口进行 Prop 验证

我正在使用 Nuxt.js（包括 Vue.js v2）和 TypeScript 构建一个网站。我想使用 interface 来检查通过 props 传递给组件的数据是否具有正确的结构。不幸的是，TypeScript 似乎没有进行任何检查。即使我向组件传递了错误的数据，也没有任何“问题”。这是一个例子。

基础组件中的数据：

data() { return { dropdownData: [ false, // enforced wrong type { title: 'Title', subtitle: 'Subtitle', }, ], }; }

传入数据的组件：

阅读更多 →

typescript - 如何在 nuxt store 的 action 中使用 axios

首先，axios 的设置是按照 nuxtjs 文档进行的，如下所示。

modules: [ '@nuxtjs/axios', ], axios: { // extra config e.g // BaseURL: 'https://link-to-API' }

我尝试建立一个 store 并在 action 中调用 axios，但遇到了 undefined。user.ts

import { Module, VuexAction } from 'nuxt-property-decorator'; @Module({ name: 'user', stateFactory: true, namespaced: true }) export default class User extends VuexModule { @VuexAction(

阅读更多 →

nuxt.js - 属性 '$router' 在类型上不存在，nuxt 和 typescript？

我最近在一个 Nuxt 项目中集成了 TypeScript，并遇到了那个 $router 错误，以及我在内部声明的属性问题

按照文档 https://typescript.nuxtjs.org/es/cookbook/components 中的说明执行后，我不再收到这些错误，但我对如何操作以避免必须将这一部分添加到每个组件中仍有疑问

import Vue from "vue"; export default Vue.extend({ data(){ return { property1: '' } } });

并且只将其作为 export default { data(){return {property1: ''}}}

阅读更多 →

typescript - 现在如何在 nuxt.config.ts 中让导入的路径别名可见？

在这个问题中，我不讨论通常看起来像这样的NuxtConfig.alias属性：

const Config: NuxtConfig = { alias: { "@EnterpriseBusinessRules": Path.resolve(__dirname, "BusinessRules", "Enterprise"), "@ApplicationBusinessRules": Path.resolve(__dirname, "BusinessRules", "Application"), // ... }

我所说的是：

import EnvironmentVariables from "@Environment/EnvironmentVariables"; impor

阅读更多 →