Module is not defined in Vue project-PHP Chinese Network Q&A

Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

Module is not defined in Vue project

P粉235202573 2023-11-17 12:38:53

999

I just created a new Vue application by runningnpm init vue@latestas specified in the official documentation. I then tried to add Tailwind to my application following the guides on the Vue and Vite websites. However, when opening the filetailwind.config.js, I noticed that ESLint tells me thatmoduleis undefined and themodule.exportssyntax does not work.

why is that? How can I solve it?

Edit: The default.eslintrc.cjsfile created by Vue is as follows:

/* eslint-env node */ require("@rushstack/eslint-patch/modern-module-resolution"); module.exports = { root: true, extends: [ "plugin:vue/vue3-essential", "eslint:recommended", "@vue/eslint-config-prettier", ], parserOptions: { ecmaVersion: "latest", }, };

P粉235202573

reply all (2)

P粉3331862852023-11-18 12:14:31 2 floor

Consider using

.eslintrc.cjs

… overrides: [ { files: ["{vue,vite}.config.*"], env: { node: true, }, }, ],

and set thecompilerOptions.types: ["node"]TS option only for these files.

It might look like this:

.eslintrc.cjs

/* eslint-env node */ require("@rushstack/eslint-patch/modern-module-resolution"); module.exports = { root: true, extends: [ "plugin:vue/vue3-essential", "eslint:recommended", "@vue/eslint-config-typescript", "@vue/eslint-config-prettier", ], overrides: [ { files: ["cypress/e2e/**/*.{cy,spec}.{js,ts,jsx,tsx}"], extends: ["plugin:cypress/recommended"], }, { files: ["{vue,vite}.config.*"], env: { node: true, }, }, ], parserOptions: { ecmaVersion: "latest", }, };

tsconfig.config.json

{ "extends": "@vue/tsconfig/tsconfig.node.json", "include": ["vue.config.*", "vite.config.*", "vitest.config.*", "cypress.config.*", "playwright.config.*"], "compilerOptions": { "composite": true, "types": ["node"] } }

Like+0

Add Reply

P粉7388210352023-11-18 10:58:04 1 floor

Add it to.eslintrc.cjs

env: { node: true, },

So your file looks like

/* eslint-env node */ require("@rushstack/eslint-patch/modern-module-resolution"); module.exports = { root: true, env: { node: true, }, extends: [ "plugin:vue/vue3-essential", "eslint:recommended", "@vue/eslint-config-prettier", ], parserOptions: { ecmaVersion: "latest", }, };

You can add anyof thesevalues

Like+0

Add Reply