nuxt-pwa-module icon indicating copy to clipboard operation
nuxt-pwa-module copied to clipboard

Non-relative paths are not allowed when 'baseUrl' is not set.

Open Quineone opened this issue 1 year ago • 5 comments

Cause the Nuxt: 3.7 use purely relative paths in the generated tsconfig.json instead of setting a baseUrl, there will throw error when type check.

image

Quineone avatar Sep 19 '23 09:09 Quineone

To override this temporarily, in your tsconfig.json override compilerOptions

{
  // https://nuxt.com/docs/guide/concepts/typescript
  "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    "paths": {
      "#pwa": [
        "./.nuxt/types/pwa"
      ],
    }
  }
}

mo9a7i avatar Oct 08 '23 16:10 mo9a7i

Just sharing thoughts, I might be wrong again too.

I stand corrected, applying the above solution caused some weird behavior in typescript in my project, leading to some variables being set as type unknown

The proper method to override the paths in ./.nuxt/tsconfig.json as per https://nuxt.com/docs/guide/concepts/typescript#nuxttsconfigjson is to use nuxt.config.ts alias property as below:

alias:{
    "#pwa": "./.nuxt/types/pwa"
},

mo9a7i avatar Oct 09 '23 08:10 mo9a7i

@mo9a7i doesnt overwrite it for me. patchman strikes again:

diff --git a/dist/module.mjs b/dist/module.mjs
index 73a3c87b5c1af0571337c66dbe6f0aef36a0034e..319493594d33cdcf7b00f6a4e0d79fd5b43fe752 100644
--- a/dist/module.mjs
+++ b/dist/module.mjs
@@ -153,7 +153,7 @@ const icon = async (pwa) => {
     getContents: () => `export type IconSize = number | ${options.sizes.map((size) => `'${size}'`).join(" | ")}`
   }).dst.replace(/\.d\.ts$/, "");
   nuxt.hook("prepare:types", ({ tsConfig }) => {
-    tsConfig.compilerOptions.paths["#pwa"] = [relative(nuxt.options.srcDir, typesPath)];
+    tsConfig.compilerOptions.paths["#pwa"] = ["./" + relative(nuxt.options.srcDir, typesPath)];
   });
 };

patroza avatar Oct 12 '23 10:10 patroza

@mo9a7i doesnt overwrite it for me.

patchman strikes again:


diff --git a/dist/module.mjs b/dist/module.mjs

index 73a3c87b5c1af0571337c66dbe6f0aef36a0034e..319493594d33cdcf7b00f6a4e0d79fd5b43fe752 100644

--- a/dist/module.mjs

+++ b/dist/module.mjs

@@ -153,7 +153,7 @@ const icon = async (pwa) => {

     getContents: () => `export type IconSize = number | ${options.sizes.map((size) => `'${size}'`).join(" | ")}`

   }).dst.replace(/\.d\.ts$/, "");

   nuxt.hook("prepare:types", ({ tsConfig }) => {

-    tsConfig.compilerOptions.paths["#pwa"] = [relative(nuxt.options.srcDir, typesPath)];

+    tsConfig.compilerOptions.paths["#pwa"] = ["./" + relative(nuxt.options.srcDir, typesPath)];

   });

 };

Seems i did something different to make it work

have a look here

https://github.com/ithra-2023/nuxtjs-ithra-pwa

check the .vscode file and check nuxt config for take over mode

whenever I apply those, i delete node modules and .nuxt folder and install again

mo9a7i avatar Oct 12 '23 11:10 mo9a7i

@mo9a7i doesnt overwrite it for me. patchman strikes again:

diff --git a/dist/module.mjs b/dist/module.mjs
index 73a3c87b5c1af0571337c66dbe6f0aef36a0034e..319493594d33cdcf7b00f6a4e0d79fd5b43fe752 100644
--- a/dist/module.mjs
+++ b/dist/module.mjs
@@ -153,7 +153,7 @@ const icon = async (pwa) => {
     getContents: () => `export type IconSize = number | ${options.sizes.map((size) => `'${size}'`).join(" | ")}`
   }).dst.replace(/\.d\.ts$/, "");
   nuxt.hook("prepare:types", ({ tsConfig }) => {
-    tsConfig.compilerOptions.paths["#pwa"] = [relative(nuxt.options.srcDir, typesPath)];
+    tsConfig.compilerOptions.paths["#pwa"] = ["./" + relative(nuxt.options.srcDir, typesPath)];
   });
 };

Try: 1- install [email protected] in your project manually pnpm add -D [email protected] 2- Set the version of typescript for volar to the one you setup in vscode crtl+shift+p, search for volar typescript, pick the one that shows node_modules

mo9a7i avatar Oct 23 '23 07:10 mo9a7i