From 6994b637431de3829a3412a615f690c659099135 Mon Sep 17 00:00:00 2001 From: Zhaolin Lau <68846168+zhaolinlau@users.noreply.github.com> Date: Tue, 10 Sep 2024 16:15:53 +0800 Subject: [PATCH 1/3] Update useFetch and useAsyncData snippet Replace 'pending' with 'status' and add 'clear' function --- snippets/Nuxt/composables.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/snippets/Nuxt/composables.json b/snippets/Nuxt/composables.json index 8de1b7c..1a230ff 100644 --- a/snippets/Nuxt/composables.json +++ b/snippets/Nuxt/composables.json @@ -7,7 +7,7 @@ "useAsyncData": { "prefix": "useAsyncData", "body": [ - "const { data, pending, error, refresh } = await useAsyncData(", + "const { data, status, error, refresh, clear } = await useAsyncData(", " '$2',", " () => \\$fetch('$3')", ");" @@ -37,7 +37,7 @@ "useFetch": { "prefix": "useFetch", "body": [ - "const { data, pending, error, refresh } = await useFetch('$1',{", + "const { data, status, error, refresh, clear } = await useFetch('$1',{", " $2", "})" ], From 13b8bd596074b8bdc82bd0d44b24be4afaf16ce1 Mon Sep 17 00:00:00 2001 From: Zhaolin Lau Date: Tue, 10 Sep 2024 21:36:33 +0800 Subject: [PATCH 2/3] add nuxt file extension configuration --- README.md | 5 +++-- package.json | 11 ++++++++++- src/commands/CSS.ts | 16 +++++++++------- src/commands/Composable.ts | 8 +++++--- src/commands/Middleware.ts | 8 +++++--- src/commands/Nitro.ts | 12 +++++++----- src/commands/Plugin.ts | 8 +++++--- src/commands/Store.ts | 9 ++++++--- src/commands/Structure.ts | 8 +++++--- src/commands/Util.ts | 8 +++++--- src/types.ts | 3 +++ src/utils/commands.ts | 23 +++++++++++++---------- src/watchers/config.ts | 5 +++++ 13 files changed, 81 insertions(+), 43 deletions(-) diff --git a/README.md b/README.md index 08ae6ce..a1372a8 100644 --- a/README.md +++ b/README.md @@ -56,7 +56,7 @@ Using `Nuxtr: Create Nuxt project` command, you can create a new Nuxt project wi ### Directory and File Creation -Effortlessly generate all essential directories and files for your Nuxt project right from within VSCode. Utilize the command palette or context menus to swiftly create Vue/TypeScript files, as well as special files like [`.nuxtignore`](https://nuxt.com/docs/guide/directory-structure/nuxtignore), [`.nuxtrc`](https://nuxt.com/docs/api/configuration/nuxt-config), and [`app.config.ts`](https://nuxt.com/docs/guide/directory-structure/app-config). +Effortlessly generate all essential directories and files for your Nuxt project right from within VSCode. Utilize the command palette or context menus to swiftly create Vue/TypeScript/JavaScript files, as well as special files like [`.nuxtignore`](https://nuxt.com/docs/guide/directory-structure/nuxtignore), [`.nuxtrc`](https://nuxt.com/docs/api/configuration/nuxt-config), and [`app.config.(ts/js)`](https://nuxt.com/docs/guide/directory-structure/app-config). To initiate any creation action, simply prepend it with the prefix **`Nuxtr: Create...`** and **`Nuxtr: Nuxt project structure...`** command for creating the entire project structure. @@ -70,7 +70,8 @@ Customize Vue file templates with these settings: "nuxtr.vueFiles.style.addStyleTag": true, "nuxtr.vueFiles.style.alwaysScoped": true, "nuxtr.vueFiles.style.defaultLanguage": "scss", -"nuxtr.piniaFiles.defaultTemplate": "options" +"nuxtr.piniaFiles.defaultTemplate": "options", +"nuxtr.nuxtFiles.defaultLanguage": "js" ``` Additionally, you can choose to automatically open the newly created file with: diff --git a/package.json b/package.json index 376d69e..0653fc3 100644 --- a/package.json +++ b/package.json @@ -574,7 +574,16 @@ "setup" ], "description": "Default language for script tag" - } + }, + "nuxtr.nuxtFiles.defaultLanguage":{ + "type": "string", + "default": "ts", + "enum": [ + "js", + "ts" + ], + "description": "Default language for nuxt files" + } } }, { diff --git a/src/commands/CSS.ts b/src/commands/CSS.ts index e9a54f3..96fea93 100644 --- a/src/commands/CSS.ts +++ b/src/commands/CSS.ts @@ -1,6 +1,8 @@ import { window } from 'vscode' import { tailwindCSSFile, tailwindCSSJSConfig, tailwindCSSTSConfig, unoCSSConfig, vuetifyConfigFile, windiCSSConfig } from '../templates' -import { createFile, getInstallationCommand, isNuxtTwo, openExternalLink, projectRootDirectory, projectSrcDirectory, runCommand, updateNuxtConfig } from '../utils' +import { createFile, getInstallationCommand, isNuxtTwo, openExternalLink, projectRootDirectory, projectSrcDirectory, runCommand, updateNuxtConfig, nuxtrConfiguration } from '../utils' + +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage const frameworks = ['TailwindCSS', 'WindiCSS', 'UnoCSS', 'Vuetify'] @@ -106,9 +108,9 @@ const configureTailwind = () => { if (selections.includes(TailwindOptions.createConfigFile)) { await createFile({ - fileName: `tailwind.config.${isNuxtTwo() ? 'js' : 'ts'}`, + fileName: `tailwind.config.${isNuxtTwo() ? 'js' : nuxtLang}`, content: isNuxtTwo() ? tailwindCSSJSConfig : tailwindCSSTSConfig, - fullPath: `${projectRootDirectory()}/tailwind.config.${isNuxtTwo() ? 'js' : 'ts'}`, + fullPath: `${projectRootDirectory()}/tailwind.config.${isNuxtTwo() ? 'js' : nuxtLang}`, }) } @@ -128,7 +130,7 @@ const configureTailwind = () => { const configureWindi = async () => { try { - const filePath = `${await projectSrcDirectory()}/windi.config.${isNuxtTwo() ? 'js' : 'ts'}` + const filePath = `${await projectSrcDirectory()}/windi.config.${isNuxtTwo() ? 'js' : nuxtLang}` const windiOptions = Object.values(WindiOptions) @@ -155,7 +157,7 @@ const configureWindi = async () => { if (selections.includes(WindiOptions.createConfigFile)) { await createFile({ - fileName: `windi.config.${isNuxtTwo() ? 'js' : 'ts'}`, + fileName: `windi.config.${isNuxtTwo() ? 'js' : nuxtLang}`, content: windiCSSConfig, fullPath: filePath, }) @@ -176,7 +178,7 @@ const configureWindi = async () => { const configureUno = async () => { try { - const filePath = `${await projectSrcDirectory()}/uno.config.ts` + const filePath = `${await projectSrcDirectory()}/uno.config.${nuxtLang}` const unoCSSOptions = Object.values(UnoCSSOptions) @@ -203,7 +205,7 @@ const configureUno = async () => { if (selections.includes(UnoCSSOptions.createConfigFile)) { await createFile({ - fileName: `uno.config.ts`, + fileName: `uno.config.${nuxtLang}`, content: unoCSSConfig, fullPath: filePath, }) diff --git a/src/commands/Composable.ts b/src/commands/Composable.ts index 54f5a5a..3c137b0 100644 --- a/src/commands/Composable.ts +++ b/src/commands/Composable.ts @@ -1,7 +1,9 @@ import { window } from 'vscode' -import { createDir, createFile, createSubFolders, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick } from '../utils' +import { createDir, createFile, createSubFolders, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick, nuxtrConfiguration } from '../utils' import { composableTemplate } from '../templates' +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage + const createComposable = () => { window .showInputBox({ @@ -37,10 +39,10 @@ const directCreateComposable = (path: string) => { .then((name) => { if (!name) { return } - const filePath = `${path}/${normalizeFileExtension(name, '.ts')}.ts` + const filePath = `${path}/${normalizeFileExtension(name, `.${nuxtLang}`)}.${nuxtLang}` createFile({ - fileName: `${name}.ts`, + fileName: `${name}.${nuxtLang}`, content: composableTemplate(name), fullPath: filePath, }) diff --git a/src/commands/Middleware.ts b/src/commands/Middleware.ts index 4720c89..91f81d8 100644 --- a/src/commands/Middleware.ts +++ b/src/commands/Middleware.ts @@ -1,7 +1,9 @@ import { window } from 'vscode' -import { createDir, createFile, createSubFolders, hasServerDir, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick} from '../utils' +import { createDir, createFile, createSubFolders, hasServerDir, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick, nuxtrConfiguration } from '../utils' import { nitroDefaultTemplate, nuxtMiddlewareTemplate } from '../templates' +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage + const createMiddleware = () => { window .showInputBox({ @@ -40,10 +42,10 @@ const directCreateMiddleware = async (path: string) => { .then((name) => { if (!name) { return } - const filePath = `${path}/${normalizeFileExtension(name, '.ts')}.ts` + const filePath = `${path}/${normalizeFileExtension(name, `.${nuxtLang}`)}.${nuxtLang}` createFile({ - fileName: `${name}.ts`, + fileName: `${name}.${nuxtLang}`, content: filePath.includes(`${serverDir}`) ? nitroDefaultTemplate : nuxtMiddlewareTemplate, fullPath: filePath, }) diff --git a/src/commands/Nitro.ts b/src/commands/Nitro.ts index f727f26..413778c 100644 --- a/src/commands/Nitro.ts +++ b/src/commands/Nitro.ts @@ -1,7 +1,9 @@ import { window } from 'vscode' -import { createDir, createFile, createSubFolders, hasServerDir, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick } from '../utils' +import { createDir, createFile, createSubFolders, hasServerDir, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick, nuxtrConfiguration } from '../utils' import { nitroDefaultTemplate, nitroPluginTemplate, nitroUtilTemplate } from '../templates' +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage + const createNitroAPI = () => { window .showInputBox({ @@ -145,9 +147,9 @@ const directCreateNitroAPI = (path: string) => { await createDir('server') await createDir('server/api') - const filePath = `${path}/${normalizeFileExtension(name, '.ts')}.ts` + const filePath = `${path}/${normalizeFileExtension(name, `.${nuxtLang}`)}.${nuxtLang}` createFile({ - fileName: `${name}.ts`, + fileName: `${name}.${nuxtLang}`, content: nitroDefaultTemplate, fullPath: filePath, }) @@ -166,10 +168,10 @@ const directCreateNitroRoute = (path: string) => { createDir('server') createDir('server/routes') - const filePath = `${path}/${normalizeFileExtension(name, '.ts')}.ts` + const filePath = `${path}/${normalizeFileExtension(name, `.${nuxtLang}`)}.${nuxtLang}` createFile({ - fileName: `${name}.ts`, + fileName: `${name}.${nuxtLang}`, content: nitroDefaultTemplate, fullPath: filePath, }) diff --git a/src/commands/Plugin.ts b/src/commands/Plugin.ts index 7508de9..e39c091 100644 --- a/src/commands/Plugin.ts +++ b/src/commands/Plugin.ts @@ -1,7 +1,9 @@ import { window } from 'vscode' -import { createDir, createFile, createSubFolders, hasServerDir, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick } from '../utils' +import { createDir, createFile, createSubFolders, hasServerDir, normalizeFileExtension, projectSrcDirectory, showSubFolderQuickPick, nuxtrConfiguration } from '../utils' import { nitroPluginTemplate, nuxtPluginTemplate } from '../templates' +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage + const createPlugin = () => { window .showInputBox({ @@ -39,11 +41,11 @@ const directCreatePlugin = async (path: string) => { .then((name) => { if (!name) { return } - const filePath = `${path}/${normalizeFileExtension(name, '.ts')}.ts` + const filePath = `${path}/${normalizeFileExtension(name, `.${nuxtLang}`)}.${nuxtLang}` createFile({ - fileName: `${name}.ts`, + fileName: `${name}.${nuxtLang}`, content: filePath.includes(`${serverDir}`) ? nitroPluginTemplate : nuxtPluginTemplate, fullPath: filePath, }) diff --git a/src/commands/Store.ts b/src/commands/Store.ts index 3084489..1b08f00 100644 --- a/src/commands/Store.ts +++ b/src/commands/Store.ts @@ -9,11 +9,14 @@ import { normalizeFileExtension, projectSrcDirectory, runCommand, - updateNuxtConfig + updateNuxtConfig, + nuxtrConfiguration } from '../utils' import { vuexContent } from '../templates' +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage + async function detectPiniaModule() { const moduleName = '@pinia/nuxt' const isConfigured = isModuleConfigured(moduleName) @@ -46,7 +49,7 @@ const createStore = () => { .then(async (name: any) => { if (!name) { return } - const filePath = `${await projectSrcDirectory()}/${isNuxtTwo() ? 'store' : 'stores'}/${name}.${isNuxtTwo() ? 'js' : 'ts'}` + const filePath = `${await projectSrcDirectory()}/${isNuxtTwo() ? 'store' : 'stores'}/${name}.${isNuxtTwo() ? 'js' : nuxtLang}` await (isNuxtTwo() ? createFile({ fileName: name, content: vuexContent, @@ -70,7 +73,7 @@ const directCreateStore = (path: string) => { .then(async (name) => { if (!name) { return } - const filePath = `${path}/${normalizeFileExtension(name, isNuxtTwo() ? '.js' : '.ts' )}.${isNuxtTwo() ? 'js' : 'ts'}` + const filePath = `${path}/${normalizeFileExtension(name, isNuxtTwo() ? '.js' : `.${nuxtLang}` )}.${isNuxtTwo() ? 'js' : nuxtLang}` await (isNuxtTwo() ? createFile({ fileName: name, diff --git a/src/commands/Structure.ts b/src/commands/Structure.ts index ebe7fb2..54df945 100644 --- a/src/commands/Structure.ts +++ b/src/commands/Structure.ts @@ -1,8 +1,10 @@ import { window } from 'vscode' import { existsSync, mkdirSync } from 'node:fs' -import { createFile, generateVueFileTemplate, isNuxtTwo, projectRootDirectory, projectSrcDirectory } from '../utils' +import { createFile, generateVueFileTemplate, isNuxtTwo, projectRootDirectory, projectSrcDirectory, nuxtrConfiguration } from '../utils' import { appConfigContent } from '../templates' +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage + function promptDirectorySelection() { let directories = ['components', 'pages', 'assets', 'plugins', 'layouts', 'middleware', 'modules',] @@ -53,9 +55,9 @@ const projectStructure = () => { const appConfig = () => { createFile({ - fileName: 'app.config.ts', + fileName: `app.config.${nuxtLang}`, content: appConfigContent, - fullPath: `${projectRootDirectory()}/app.config.ts`, + fullPath: `${projectRootDirectory()}/app.config.${nuxtLang}`, }) } diff --git a/src/commands/Util.ts b/src/commands/Util.ts index 9c31b21..a2b8fa7 100644 --- a/src/commands/Util.ts +++ b/src/commands/Util.ts @@ -1,7 +1,9 @@ import { window } from 'vscode' -import { createDir, createFile, createSubFolders, hasServerDir, projectSrcDirectory, showSubFolderQuickPick } from '../utils' +import { createDir, createFile, createSubFolders, hasServerDir, projectSrcDirectory, showSubFolderQuickPick, nuxtrConfiguration } from '../utils' import { nitroUtilTemplate, nuxtUtilTemplate } from '../templates' +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage + const createUtil = () => { window .showInputBox({ @@ -39,11 +41,11 @@ const directCreateUtil = async (path: string) => { .then((name) => { if (!name) { return } - const filePath = `${path}/${name}.ts` + const filePath = `${path}/${name}.${nuxtLang}` createFile({ - fileName: `${name}.ts`, + fileName: `${name}.${nuxtLang}`, content: filePath.includes(`${serverDir}`) ? nitroUtilTemplate : nuxtUtilTemplate(), fullPath: filePath, }) diff --git a/src/types.ts b/src/types.ts index d71c392..dbca372 100644 --- a/src/types.ts +++ b/src/types.ts @@ -45,6 +45,9 @@ export interface NuxtrConfiguration { defaultTemplate: string; }; }; + nuxtFiles:{ + defaultLanguage: "js" | "ts" + } intellisense: { vueFiles: boolean; nuxtignore: boolean; diff --git a/src/utils/commands.ts b/src/utils/commands.ts index bb67bbe..b7e59a8 100644 --- a/src/utils/commands.ts +++ b/src/utils/commands.ts @@ -1,4 +1,7 @@ import { hasServerDir } from "../utils"; +import { nuxtrConfiguration } from '.' + +const nuxtLang = nuxtrConfiguration().nuxtFiles.defaultLanguage export const getCommandType = async (commandType: string) => { let type = { @@ -19,7 +22,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Composables', path: 'composables', - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -43,7 +46,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Store', path: 'store', - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -51,7 +54,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Middleware', path: 'middleware', - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -59,7 +62,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Plugins', path: 'plugins', - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -67,7 +70,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'APIs', path: `${await hasServerDir()}/api`, - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -75,7 +78,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Routes', path: `${await hasServerDir()}/routes`, - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -83,7 +86,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Plugins', path: `${await hasServerDir()}/plugins`, - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -91,7 +94,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Middleware', path: `${await hasServerDir()}/middleware`, - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -99,7 +102,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Utilities', path: `utils`, - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } @@ -107,7 +110,7 @@ export const getCommandType = async (commandType: string) => { type = { name: 'Utility', path: `${await hasServerDir()}/utils`, - extension: '.ts', + extension: `.${nuxtLang}`, }; break; } diff --git a/src/watchers/config.ts b/src/watchers/config.ts index b986efe..cffe7f4 100644 --- a/src/watchers/config.ts +++ b/src/watchers/config.ts @@ -16,6 +16,11 @@ const reloatWindowProps = () => { }); } +export const nuxtFilesConfigWatcher: Disposable = + createConfigWatcher('nuxtr.nuxtFiles.defaultLanguage', async () => { + reloatWindowProps(); + }); + export const nuxtSnippetsConfigWatcher: Disposable = createConfigWatcher('nuxtr.snippets.nuxt', async () => { await toggleSnippets('Nuxt', nuxtrConfiguration().snippets.nuxt) From 40f5e56282c465ab6d558a66be4682f157bb0b7d Mon Sep 17 00:00:00 2001 From: Zhaolin Lau Date: Tue, 10 Sep 2024 23:50:48 +0800 Subject: [PATCH 3/3] update app config title --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 0653fc3..2370a84 100644 --- a/package.json +++ b/package.json @@ -854,7 +854,7 @@ }, { "command": "nuxtr.appConfig", - "title": "Create app.config.ts file", + "title": "Create app.config.(ts/js) file", "category": "Nuxtr", "when": "nuxtr.isNuxtProject" },