Comments (15)
We should remove prettier and eslint from the individual packages and hoist them up to the root of the monorepo so that they
can be applied everywhere. This will also require moving their respective prettier and eslint plugins to the root as well.
Scripts that should reside in the root of the monorepo:
lint
->prettier --check . && eslint .
format
->prettier --write .
build
->pnpm -r build
(this executes the script of each sub-package since they'll be individually in charge of their ownbuild
script)check
->pnpm --parallel check
test
->pnpm --parallel test
(tests should only run after all the projects have been built, so we can safely execute them in parallel)test:integration
->pnpm --parallel test:integration
dev
->pnpm -F next.skeleton.dev dev
(this is what we currently have. it starts-up the dev server for the docs site, which in turn, starts up the dev servers for all of the packages)
Each package will be in charge of their own scripts for build
, dev
(which is build
but in watch-mode), test
, test:integration
, and check
.
from skeleton.
I have the repo cloned locally. I am going to add the plugins I mentioned, just using the recommended configs, and run the tests to see if it seems feasible to make the changes for React. The defaults for eslint-plugin-svelte
are actually quite sane, so it's probably best left alone.
from skeleton.
@endigo9740 Of course man, I didn't expect you to respond on the weekend anyway. I was just documenting my progress so you guys would see it whenever you had the chance. Long story short though, PR is open with the changes, I will need to rollback if there are any changes requested to the configs, but I can cross that bridge when the time comes. As for the frameworks, it's super simple to just add another plugin and override to Prettier and/or ESLint. In fact, Vue could be added with 5 or 6 lines in ESLint and 2 or 3 in Prettier, as could Solid; so, the expandability is there. Anyhow, I have done what I can. I'm sure you guys will review everything once the launch happens on Tuesday and we can go from there. Forewarning, however, I work full-time as a truck driver on nights. I generally work 8pm until around 7am US Central Time, so I may lag about a day behind on code reviews.
from skeleton.
From @eagerestwolf on Discord:
Are you okay with a stricter ESLint Config? React doesn't have the same level of a11y checking that Svelte does by default (and by that I mean it doesn't check a11y at all). A few plugins that are basically essential for a React component library these days (assuming you aren't using headless primitives like Radix-UI, more on that in a bit) are eslint-plugin-jsx-a11y (this plugin checks your JSX to ensure a11y with screen readers and other assistive technologies, and also provides some good UX defaults as well), eslint-plugin-react (this plugin helps ensure all of your JSX is consistent and predictable, as well as consistently enforcing usage, or lack thereof, of the new React runtime introduced in React 17), eslint-plugin-react-hooks(this plugin helps make sure you are using React's hooks [useEffect, useCallback, useState, useMemo, etc.] correctly, and following React's Rules of Hooks), and eslint-plugin-react-compiler(this plugin helps you make sure your React app and associated components will play nicely with React's new compiler, using the compiler is not necessary to use the plugin; this plugin also helps ensure you are following React's Rules of React).
from skeleton.
@AdrianGonz97 FYI, see above. You can read the full discussion around this on the Discord > #skeleton-next
channel.
from skeleton.
Case in point of how using the right tools makes the job a lot easier. I just found and squashed at least 2 component bugs (malformed JSX attributes), and found a usage of useEffect
where the dependency array is useless because the code changes on every render anyway, thus causing an infinite render loop. The only function called just needed to be created as a memoized callback.
/home/seth/Projects/skeleton/packages/skeleton-react/src/lib/components/ProgressRing/ProgressRing.tsx
49:6 warning React Hook useEffect has a missing dependency: 'calcDashOffset'. Either include it or remove the dependency array react-hooks/exhaustive-deps
/home/seth/Projects/skeleton/packages/skeleton-react/src/lib/components/ProgressRing/ProgressRing.tsx
51:3 warning The 'calcDashOffset' function makes the dependencies of useEffect Hook (at line 49) change on every render. Move it inside the useEffect callback. Alternatively, wrap the definition of 'calcDashOffset' in its own useCallback() Hook react-hooks/exhaustive-deps
Additionally, I need input on this one. So, in Svelte, I know they follow the HTML standard of a form element being inside a label being enough to associate a form label and control. However, JSX doesn't follow HTML standards, it follows XML standards (JSX actually means JavaScript XML); therefore a for/name connection is required to associate a label with a control. How would you like to proceed on that? Should we follow the correct React standard, or the correct web standard? I can disable the jsx-a11y/label-has-associated-control
rule, but that seems to be counterproductive to having the a11y plugin to begin with.
/home/seth/Projects/skeleton/packages/skeleton-react/src/App.tsx
29:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
/home/seth/Projects/skeleton/packages/skeleton-react/src/routes/components/switch.tsx
33:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
43:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
53:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
64:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
77:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
90:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
from skeleton.
Also, for the React package, the easiest check is probably just to do tsc --noEmit
. I have implemented that as a check unless someone comes up with something better.
EDIT: I also added Prettier, but oh boy this is going to be a big PR. Basically every file was using spaces instead of tabs, and there were plenty of trailing commas, so Prettier touched basically everything; but it's all up to the same standards as the rest of the repo now. Might I suggest an EditorConfig in the repo root?
from skeleton.
Oops, I forgot I have Headwind installed. Crap, now I gotta do all this all over again, it changed all the className
orders in every file I touched.
from skeleton.
@AdrianGonz97 FYI, see above. You can read the full discussion around this on the Discord >
#skeleton-next
channel.
@AdrianGonz97's idea could actually still work. If you hoist the default configs to the top, and set the root option for ESLint, both ESLint and Prettier will default to a config that is a merge of the config closest to the file being checked/linted/fixed/formatted and the root config. So, the root ESLint config could have all the JavaScript and TypeScript related things (you'll need to override the typescript-eslint project in each package), but then you could add the React/Svelte specifics as needed. Anyhow, I'll look into that one when I wake up. I have been up for over 24 hours now. I worked last night, but I at least wanted to take a stab at seeing what I could improve.
from skeleton.
Working on Prettier now. Some things that will need to be resolved, since I forgot that Prettier actually doesn't support split configs like ESLint, are listed below. Mind you these are stylistic choices and do not affect the final product in any meaningful way:
printWidth
: some parts of the project have a print width of 140, while others use a print width of 120tabWidth
: some parts of the project are using a tab width of 2, while others are using a tab width of 4trailingComma
: some parts of the project use all trailing commas, some use none
While this ultimately has no bearing, it's good to pick a style and be consistent with it (it helps reduce bugs from poorly formatted code). Assuming you're doing the tabWidth
of 4 for Svelte and Astro files since they are essentially HTML, I would advise using a tabWidth
of 2, with a Svelte and Astro override for 4 (side effect of this is that the scripts in Svelte scripts will also have a tab width of 4). As for print width, it's probably just best to standardize on 140, since that's what most of the parts of this project are using. Likewise with trailing commas, you should probably standardize on none, since that's what most of the parts of this project are using.
Assuming those are the changes you want, the root config would like what is shown below (mind you, I removed any references to semi
because it's only ever set to true
which is the default) (side note: I'm also using Prettier's new config format)
import astroPlugin from 'prettier-plugin-astro';
import sveltePlugin from 'prettier-plugin-svelte';
/** @type {import('prettier').Config} */
export default {
overrides: [
{
files: '*.astro',
options: {
parser: 'astro',
tabWidth: 4
}
},
{
files: '*.svelte',
options: {
parser: 'svelte',
tabWidth: 4
}
}
],
plugins: [astroPlugin, sveltePlugin],
printWidth: 140,
singleQuote: true,
trailingComma: 'none',
useTabs: true
}
I'm also tinkering with the idea of having an EditorConfig in the root of the repo. This will allow users to adapt to Skeleton's coding style (to some extent) without needing to make major changes to their editor's settings (assuming they have the extension installed, if required).
root = true
[*]
charset = utf-8
end_of_line = lf
indent_size = 2
indent_style = tab
insert_final_newline = true
tab_width = 2
trim_trailing_whitespace = true
[*.{astro,svelte}]
indent_size = 4
tab_width = 4
That also kind of demonstrates the power of EditorConfig and Prettier there, you can set arbitrary, per file style choices. It's important to remember that Prettier supports more than just JavaScript and TypeScript. These changes (minus things like trailing comma) also apply to HTML, Svelte, Astro, JSX/TSX, JSON, and more. Also, this is more of a personal suggestion, I would advise dropping hard tabs in favor of spaces. Spaces over tabs is pretty much the standard in the entire JS community at this point, and other communities are also making similar changes; however, it's your project, and how you want it set up is what you will get. I just wanted to offer some guidance there.
from skeleton.
I would also suggest prettier-plugin-tailwindcss
(partly becuase then I don't have to remember to disable Headwind in VSCode) because I know it seems like it wouldn't, but the order of your Tailwind classes actually does matter to some extent. Namely when it comes to compression. If you standardize the order of your Tailwind classes, then it will compress much better.
from skeleton.
Ok, I lied. Apparently Prettier does supported nested configs...it just says it doesn't. Anyhow, it's all in the root now, just need to standardize the rules. I am still working on ESLint, and attempting to get a flat config working (just to see if/how you guys like it). This is what I have so far. It won't work at the moment though and I am attempting to debug it (it keeps throwing an error about an unknown keyword meta
, it's probably something somewhere in the plugins).
import js from "@eslint/js";
import jsxA11y from "eslint-plugin-jsx-a11y";
import prettierRecommended from "eslint-plugin-prettier";
import react from "eslint-plugin-react";
import reactRecommended from "eslint-plugin-react/configs/recommended.js";
import reactCompiler from "eslint-plugin-react-compiler";
import reactHooks from "eslint-plugin-react-hooks";
import reactRefresh from "eslint-plugin-react-refresh";
import svelte from 'eslint-plugin-svelte';
import globals from "globals";
import ts from "typescript-eslint";
/** @type {import('eslint').Linter.FlatConfig[]} */
export default [
{
linterOptions: {
reportUnusedDisableDirectives: "warn"
}
},
// Basic JavaScript rule checking (basically equivalent to extends "eslint:recommended")
{
files: ['**/*.{cjs,js,jsx,mjs}'],
languageOptions: {
globals: {
...globals.es2017,
...globals.node
}
},
rules: {
...js.configs.recommended.rules,
'no-useless-escape': 'off'
}
},
// TS Rules
{
// Extends the default recommended TypeScript eslint config
...ts.configs.recommended,
// Apply required overrides
files: ['**/*.{ts,tsx}'],
languageOptions: {
globals: {
...globals.es2017,
...globals.node
},
parserOptions: {
extraFileExtensions: ['.svelte']
}
},
rules: {
'no-empty-function': 'off',
'@typescript-eslint/no-empty-function': ['error', { allow: ['arrowFunctions'] }]
}
},
// React
{
// Enforce usage of JSX/TSX
files: ['**/*.{jsx,tsx}'],
languageOptions: {
globals: {
...globals.browser,
...globals.es2020
},
parserOptions: {
ecmaFeatures: {
jsx: true
}
}
},
plugins: {
'jsx-a11y': jsxA11y,
react,
'react-compiler': reactCompiler,
'react-hooks': reactHooks,
'react-refresh': reactRefresh
},
rules: {
...jsxA11y.configs.recommended,
...reactRecommended,
...reactHooks.configs.recommended,
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
'react-compiler/react-compiler': 'error'
}
},
// Svelte config, man Svelte makes this easy (kinda like they do everything)
...svelte.configs['flat/recommended'],
...svelte.configs['flat/prettier'],
// Prettier now gets its own config at the end, so that it can make the overrides it needs to
// IMPORTANT: THIS MUST BE THE LAST CONFIG!!!
prettierRecommended
];
from skeleton.
Ok, nevermind. Not going with a flat config. I keep getting an error about an unexpected array in the config, and I don't know why. Anyhow, got everything working with one singular root config, but oh boy there's a lot of errors. With this setup, anything can be overriden with a nested Prettier or ESLint config if that project requires it, and the nested .eslintignore
and .prettierignore
files continue to function as expected.
skeleton on next [✘!?] via v20.14.0 took 8s
❯ pnpm eslint .
/home/seth/Projects/skeleton/packages/skeleton-react/src/App.tsx
29:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
/home/seth/Projects/skeleton/packages/skeleton-react/src/lib/components/ProgressRing/ProgressRing.tsx
44:8 error 'circumference' is never reassigned. Use 'const' instead prefer-const
44:23 error 'setCircumference' is never reassigned. Use 'const' instead prefer-const
45:8 error 'dashoffset' is never reassigned. Use 'const' instead prefer-const
45:20 error 'setDashoffset' is never reassigned. Use 'const' instead prefer-const
49:6 warning React Hook useEffect has a missing dependency: 'calcDashOffset'. Either include it or remove the dependency array react-hooks/exhaustive-deps
/home/seth/Projects/skeleton/packages/skeleton-react/src/routes/components/avatars.tsx
56:6 error Unknown property 'color-interpolation-filters' found, use 'colorInterpolationFilters' instead react/no-unknown-property
/home/seth/Projects/skeleton/packages/skeleton-react/src/routes/components/switch.tsx
33:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
43:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
53:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
64:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
77:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
90:9 error A form label must be associated with a control jsx-a11y/label-has-associated-control
/home/seth/Projects/skeleton/packages/skeleton-svelte/src/lib/components/Accordion/AccordionItem.svelte
5:16 error 'Mouse' is defined but never used @typescript-eslint/no-unused-vars
/home/seth/Projects/skeleton/packages/skeleton-svelte/src/routes/components/accordions/+page.svelte
7:8 error 'ontoggle' is assigned a value but never used @typescript-eslint/no-unused-vars
/home/seth/Projects/skeleton/packages/skeleton-svelte/src/routes/components/tabs/+page.svelte
45:6 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
49:6 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
53:6 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
70:6 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
73:6 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
76:6 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/packages/skeleton/src/plugin/extends/animations.ts
15:44 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/packages/vite-plugin-tw-plugin-watcher/index.d.ts
26:24 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/components/docs/FrameworkTabs.tsx
4:38 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/components/docs/Preview.tsx
4:32 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/components/docs/Search.svelte
205:13 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/env.d.ts
1:1 error Do not use a triple slash reference for ../.astro/types.d.ts, use `import` style instead @typescript-eslint/triple-slash-reference
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/accordions/Example.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/app-bars/Example.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/app-bars/ExampleResponsive.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/app-bars/ExampleToolbar.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/avatars/Example.tsx
4:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/progress-rings/ExampleIcons.tsx
1:10 error 'useState' is defined but never used @typescript-eslint/no-unused-vars
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/switch/Example.tsx
4:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/switch/ExampleCompact.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/switch/ExampleIcons.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/switch/ExampleLightswitch.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/switch/ExampleList.tsx
4:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
11:4 error A form label must be associated with a control jsx-a11y/label-has-associated-control
16:4 error A form label must be associated with a control jsx-a11y/label-has-associated-control
26:4 error A form label must be associated with a control jsx-a11y/label-has-associated-control
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/tabs/Example.tsx
4:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/tabs/ExampleFocusableContent.tsx
4:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/tabs/ExampleIcons.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/tabs/ExampleJustify.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/tabs/ExampleRTL.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/tabs/ExampleStretch.tsx
4:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/components/tabs/ExampleVerticalIcons.tsx
5:29 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/next.skeleton.dev/src/examples/tailwind/chips/ExampleSelect.tsx
5:7 error 'color' is never reassigned. Use 'const' instead prefer-const
5:14 error 'setColor' is never reassigned. Use 'const' instead prefer-const
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/components/DocsAppBar/DocsAppBar.svelte
77:4 error $storeTheme is an illegal variable name. To reference a global variable called $storeTheme, use globalThis.$storeTheme(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/components/DocsSidebar/DocsSidebar.svelte
81:7 error A11y: Non-interactive element <li> should not be assigned mouse or keyboard event listeners.(a11y-no-noninteractive-element-interactions) svelte/valid-compile
83:33 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/layouts/DocsShell/DocsShell.svelte
35:17 error $page is an illegal variable name. To reference a global variable called $page, use globalThis.$page(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/layouts/DocsShell/partials/Header.svelte
34:50 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
36:6 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/layouts/DocsShell/partials/PanelEvents.svelte
26:32 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/layouts/DocsShell/partials/PanelProps.svelte
36:31 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/layouts/DocsShell/partials/PanelSlots.svelte
26:31 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/layouts/DocsThemer/DocsThemer.svelte
116:7 error $storePreview is an illegal variable name. To reference a global variable called $storePreview, use globalThis.$storePreview(illegal-global) svelte/valid-compile
204:14 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
254:12 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/lib/layouts/LayoutPage/LayoutPage.svelte
30:9 error $storeVercelProductionMode is an illegal variable name. To reference a global variable called $storeVercelProductionMode, use globalThis.$storeVercelProductionMode(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/components/ratings/+page.svelte
41:7 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
44:7 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
47:7 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
90:8 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
93:8 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
96:8 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
122:8 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
125:8 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
128:8 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/docs/colors/+page.svelte
24:8 error 'shadesArr' is assigned a value but never used @typescript-eslint/no-unused-vars
25:8 error 'colorsArr' is assigned a value but never used @typescript-eslint/no-unused-vars
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/docs/contributing/+page.svelte
0:0 error Parsing error: </a> attempted to close element that was already automatically closed by <a> (cannot nest <a> inside <a>)
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/docs/get-started/SectionInstall.svelte
11:20 error $storeOnboardMethod is an illegal variable name. To reference a global variable called $storeOnboardMethod, use globalThis.$storeOnboardMethod(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/docs/get-started/SectionSkeleton.svelte
11:20 error $storeOnboardMethod is an illegal variable name. To reference a global variable called $storeOnboardMethod, use globalThis.$storeOnboardMethod(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/docs/get-started/SectionTailwind.svelte
15:20 error $storeOnboardMethod is an illegal variable name. To reference a global variable called $storeOnboardMethod, use globalThis.$storeOnboardMethod(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/docs/get-started/SectionThemes.svelte
30:5 error A11y: <div> with click, keydown handlers must have an ARIA role(a11y-no-static-element-interactions) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/elements/scroll-containers/+page.svelte
73:30 error '_' is defined but never used @typescript-eslint/no-unused-vars
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/(inner)/utilities/lightswitches/+page.svelte
23:6 error 'tabSection' is assigned a value but never used @typescript-eslint/no-unused-vars
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/+error.svelte
6:6 error $page is an illegal variable name. To reference a global variable called $page, use globalThis.$page(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/+layout.svelte
169:29 error $prefersReducedMotionStore is an illegal variable name. To reference a global variable called $prefersReducedMotionStore, use globalThis.$prefersReducedMotionStore(illegal-global) svelte/valid-compile
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/blog/[slug]/+page.svelte
77:3 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/skeleton.dev/src/routes/home-partials/HomeFeatures.svelte
52:8 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/themes.skeleton.dev/src/lib/components/fieldsets/Colors.svelte
60:47 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
/home/seth/Projects/skeleton/sites/themes.skeleton.dev/src/lib/components/previews/CodeGen.svelte
7:30 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
/home/seth/Projects/skeleton/sites/themes.skeleton.dev/src/lib/components/previews/Palette.svelte
121:28 error 'i' is defined but never used @typescript-eslint/no-unused-vars
126:34 error 'i' is defined but never used @typescript-eslint/no-unused-vars
/home/seth/Projects/skeleton/sites/themes.skeleton.dev/src/lib/constants.ts
7:30 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
11:34 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
120:12 error 'radii' is never reassigned. Use 'const' instead prefer-const
131:12 error 'edges' is never reassigned. Use 'const' instead prefer-const
/home/seth/Projects/skeleton/sites/themes.skeleton.dev/src/lib/generator.svelte.ts
62:6 error 'palette' is never reassigned. Use 'const' instead prefer-const
72:6 error 'code' is never reassigned. Use 'const' instead prefer-const
73:6 error 'colorsArr' is never reassigned. Use 'const' instead prefer-const
94:6 error 'colorsArr' is never reassigned. Use 'const' instead prefer-const
184:6 error 'theme' is never reassigned. Use 'const' instead prefer-const
/home/seth/Projects/skeleton/sites/themes.skeleton.dev/src/lib/state.svelte.ts
7:12 error 'stateDisplay' is never reassigned. Use 'const' instead prefer-const
7:26 error Unexpected any. Specify a different type @typescript-eslint/no-explicit-any
14:12 error 'stateFormCore' is never reassigned. Use 'const' instead prefer-const
19:12 error 'stateFormColors' is never reassigned. Use 'const' instead prefer-const
64:12 error 'stateFormBackgrounds' is never reassigned. Use 'const' instead prefer-const
71:12 error 'stateFormTypography' is never reassigned. Use 'const' instead prefer-const
107:12 error 'stateFormSpacing' is never reassigned. Use 'const' instead prefer-const
113:12 error 'stateFormEdges' is never reassigned. Use 'const' instead prefer-const
/home/seth/Projects/skeleton/sites/themes.skeleton.dev/src/routes/+layout.svelte
10:2 error `{@html}` can lead to XSS attack svelte/no-at-html-tags
✖ 107 problems (106 errors, 1 warning)
21 errors and 0 warnings potentially fixable with the `--fix` option.
Same with Prettier as well
skeleton on next [✘!?] via v20.14.0
❯ pnpm prettier -c .
Checking formatting...
[warn] .changeset/chilled-comics-hear.md
[warn] .changeset/config.json
[warn] .changeset/lovely-dingos-join.md
[warn] .changeset/mean-schools-double.md
[warn] .changeset/nasty-chefs-build.md
[warn] .changeset/pre.json
[warn] .changeset/six-tables-warn.md
[warn] .eslintrc.cjs
[warn] .github/ISSUE_TEMPLATE/bug_report.yml
[warn] .github/ISSUE_TEMPLATE/docs_issue.yml
[warn] .github/workflows-old/release-dev.yml
[warn] .github/workflows-old/release.yml
[warn] .github/workflows/release-next.yaml
[warn] .vscode/extensions.json
[warn] .vscode/launch-debug.json
[warn] .vscode/settings.json
[warn] cspell.json
[warn] infra/notes.md
[warn] packages/create-skeleton-app/README-MONO.md
[warn] packages/create-skeleton-app/README.md
[warn] packages/create-skeleton-app/scripts/prepare-templates.mjs
[warn] packages/create-skeleton-app/src/creator.js
[warn] packages/create-skeleton-app/src/index.js
[warn] packages/create-skeleton-app/src/utils.js
[warn] packages/create-skeleton-app/templates/skeleton-template-appshell/src/app.html
[warn] packages/create-skeleton-app/templates/skeleton-template-appshell/src/routes/+layout.svelte
[warn] packages/create-skeleton-app/templates/skeleton-template-appshell/src/routes/+page.svelte
[warn] packages/create-skeleton-app/templates/skeleton-template-bare/src/app.html
[warn] packages/skeleton-react/index.html
[warn] packages/skeleton-react/postcss.config.js
[warn] packages/skeleton-react/scripts/generator.js
[warn] packages/skeleton-react/scripts/schema.json
[warn] packages/skeleton-react/scripts/types.ts
[warn] packages/skeleton-react/src/App.css
[warn] packages/skeleton-react/src/App.test.tsx
[warn] packages/skeleton-react/src/App.tsx
[warn] packages/skeleton-react/src/lib/components/Accordion/Accordion.test.tsx
[warn] packages/skeleton-react/src/lib/components/Accordion/Accordion.tsx
[warn] packages/skeleton-react/src/lib/components/Accordion/schema.json
[warn] packages/skeleton-react/src/lib/components/Accordion/types.ts
[warn] packages/skeleton-react/src/lib/components/AppBar/AppBar.tsx
[warn] packages/skeleton-react/src/lib/components/AppBar/schema.json
[warn] packages/skeleton-react/src/lib/components/AppBar/types.ts
[warn] packages/skeleton-react/src/lib/components/Avatar/Avatar.tsx
[warn] packages/skeleton-react/src/lib/components/Avatar/schema.json
[warn] packages/skeleton-react/src/lib/components/Avatar/types.ts
[warn] packages/skeleton-react/src/lib/components/Progress/Progress.tsx
[warn] packages/skeleton-react/src/lib/components/Progress/schema.json
[warn] packages/skeleton-react/src/lib/components/Progress/types.ts
[warn] packages/skeleton-react/src/lib/components/ProgressRing/ProgressRing.test.tsx
[warn] packages/skeleton-react/src/lib/components/ProgressRing/ProgressRing.tsx
[warn] packages/skeleton-react/src/lib/components/ProgressRing/schema.json
[warn] packages/skeleton-react/src/lib/components/ProgressRing/types.ts
[warn] packages/skeleton-react/src/lib/components/Switch/schema.json
[warn] packages/skeleton-react/src/lib/components/Switch/Switch.test.tsx
[warn] packages/skeleton-react/src/lib/components/Switch/Switch.tsx
[warn] packages/skeleton-react/src/lib/components/Switch/types.ts
[warn] packages/skeleton-react/src/lib/components/Tabs/schema.json
[warn] packages/skeleton-react/src/lib/components/Tabs/Tabs.test.tsx
[warn] packages/skeleton-react/src/lib/components/Tabs/Tabs.tsx
[warn] packages/skeleton-react/src/lib/components/Tabs/types.ts
[warn] packages/skeleton-react/src/lib/components/Test/Test.tsx
[warn] packages/skeleton-react/src/lib/index.ts
[warn] packages/skeleton-react/src/lib/schemas.ts
[warn] packages/skeleton-react/src/main.tsx
[warn] packages/skeleton-react/src/router.ts
[warn] packages/skeleton-react/src/routes/components/accordions.tsx
[warn] packages/skeleton-react/src/routes/components/app-bars.tsx
[warn] packages/skeleton-react/src/routes/components/avatars.tsx
[warn] packages/skeleton-react/src/routes/components/progress-rings.tsx
[warn] packages/skeleton-react/src/routes/components/progress.tsx
[warn] packages/skeleton-react/src/routes/components/switch.tsx
[warn] packages/skeleton-react/src/routes/components/tabs.tsx
[warn] packages/skeleton-react/src/routes/components/test.tsx
[warn] packages/skeleton-react/src/routes/index.tsx
[warn] packages/skeleton-react/tailwind.config.js
[warn] packages/skeleton-react/tests/setup.js
[warn] packages/skeleton-react/tsconfig.json
[warn] packages/skeleton-react/tsconfig.node.json
[warn] packages/skeleton-react/tsconfig.package.json
[warn] packages/skeleton-react/vite.config.ts
[warn] packages/skeleton-svelte/src/lib/components/Tab/TabsControl.svelte
[warn] packages/skeleton-svelte/src/routes/components/tabs/+page.svelte
[warn] packages/skeleton/src/plugin/generated/generated-classes.cjs
[warn] packages/vite-plugin-tw-plugin-watcher/index.js
[warn] pnpm-workspace.yaml
[warn] prettier.config.js
[warn] scripts/checkout.cjs
[warn] scripts/dev-version.js
[warn] scripts/rimraf.js
[warn] scripts/template-gen.js
[warn] sites/next.skeleton.dev/.vscode/extensions.json
[warn] sites/next.skeleton.dev/.vscode/launch.json
[warn] sites/next.skeleton.dev/.vscode/settings.json
[warn] sites/next.skeleton.dev/astro.config.js
[warn] sites/next.skeleton.dev/src/components/docs/ApiTable.astro
[warn] sites/next.skeleton.dev/src/components/docs/ChipsBar.astro
[warn] sites/next.skeleton.dev/src/components/docs/Footer.astro
[warn] sites/next.skeleton.dev/src/components/docs/FrameworkPicker.astro
[warn] sites/next.skeleton.dev/src/components/docs/Header.astro
[warn] sites/next.skeleton.dev/src/components/docs/Navigation.astro
[warn] sites/next.skeleton.dev/src/components/docs/Search.svelte
[warn] sites/next.skeleton.dev/src/components/docs/TableOfContents.astro
[warn] sites/next.skeleton.dev/src/components/mdx/index.ts
[warn] sites/next.skeleton.dev/src/content/config.ts
[warn] sites/next.skeleton.dev/src/content/docs/components/accordion/react.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/accordion/svelte.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/app-bar/react.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/avatar/react.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/avatar/svelte.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/progress-ring/react.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/progress/react.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/progress/svelte.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/switch/react.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/tabs/react.mdx
[warn] sites/next.skeleton.dev/src/content/docs/components/tabs/svelte.mdx
[warn] sites/next.skeleton.dev/src/content/docs/design/iconography.mdx
[warn] sites/next.skeleton.dev/src/content/docs/design/presets.mdx
[warn] sites/next.skeleton.dev/src/content/docs/design/spacing.mdx
[warn] sites/next.skeleton.dev/src/content/docs/design/themes.mdx
[warn] sites/next.skeleton.dev/src/content/docs/get-started/fundamentals.mdx
[warn] sites/next.skeleton.dev/src/content/docs/get-started/installation/nextjs.mdx
[warn] sites/next.skeleton.dev/src/content/docs/get-started/installation/sveltekit.mdx
[warn] sites/next.skeleton.dev/src/content/docs/get-started/mode.mdx
[warn] sites/next.skeleton.dev/src/content/docs/get-started/plugin.mdx
[warn] sites/next.skeleton.dev/src/content/docs/resources/_markdown.mdx
[warn] sites/next.skeleton.dev/src/content/docs/resources/contribute/components.mdx
[warn] sites/next.skeleton.dev/src/content/docs/resources/contribute/documentation.mdx
[warn] sites/next.skeleton.dev/src/content/docs/resources/contribute/get-started.mdx
[warn] sites/next.skeleton.dev/src/content/docs/tailwind/gradients.mdx
[warn] sites/next.skeleton.dev/src/examples/components/accordions/Example.svelte
[warn] sites/next.skeleton.dev/src/examples/components/app-bars/Example.svelte
[warn] sites/next.skeleton.dev/src/examples/components/app-bars/ExampleResponsive.svelte
[warn] sites/next.skeleton.dev/src/examples/components/app-bars/ExampleToolbar.svelte
[warn] sites/next.skeleton.dev/src/examples/components/progress-rings/Example.tsx
[warn] sites/next.skeleton.dev/src/examples/components/progress-rings/ExampleIndeterminate.svelte
[warn] sites/next.skeleton.dev/src/examples/components/progress-rings/ExampleIndeterminate.tsx
[warn] sites/next.skeleton.dev/src/examples/components/switch/ExampleCompact.svelte
[warn] sites/next.skeleton.dev/src/examples/components/switch/ExampleIcons.svelte
[warn] sites/next.skeleton.dev/src/examples/components/switch/ExampleLightswitch.svelte
[warn] sites/next.skeleton.dev/src/examples/components/switch/ExampleList.tsx
[warn] sites/next.skeleton.dev/src/examples/components/tabs/Example.svelte
[warn] sites/next.skeleton.dev/src/examples/components/tabs/ExampleFocusableContent.svelte
[warn] sites/next.skeleton.dev/src/examples/components/tabs/ExampleIcons.svelte
[warn] sites/next.skeleton.dev/src/examples/components/tabs/ExampleJustify.svelte
[warn] sites/next.skeleton.dev/src/examples/components/tabs/ExampleRTL.svelte
[warn] sites/next.skeleton.dev/src/examples/components/tabs/ExampleStretch.svelte
[warn] sites/next.skeleton.dev/src/examples/components/tabs/ExampleVerticalIcons.svelte
[warn] sites/next.skeleton.dev/src/examples/design/colors/ExampleColors.astro
[warn] sites/next.skeleton.dev/src/examples/design/colors/ExamplePairings.astro
[warn] sites/next.skeleton.dev/src/examples/design/typography/Blockquotes.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/cards/ExampleDetailed.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/chips/ExampleSelect.tsx
[warn] sites/next.skeleton.dev/src/examples/tailwind/forms/Example.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/forms/ExampleTextarea.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/gradients/Example.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/gradients/ExampleConic.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/gradients/ExampleSpinner.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/gradients/ExampleText.astro
[warn] sites/next.skeleton.dev/src/examples/tailwind/tables/Example.astro
[warn] sites/next.skeleton.dev/src/layouts/LayoutDoc.astro
[warn] sites/next.skeleton.dev/src/pages/404.astro
[warn] sites/next.skeleton.dev/src/pages/blog/[...slug]/index.astro
[warn] sites/next.skeleton.dev/src/pages/blog/index.astro
[warn] sites/next.skeleton.dev/src/pages/docs/[...slug]/index.astro
[warn] sites/next.skeleton.dev/src/pages/index.astro
[warn] sites/next.skeleton.dev/src/stores/doc-search-settings.ts
[warn] sites/next.skeleton.dev/src/stores/preferred-framework.ts
[warn] sites/next.skeleton.dev/svelte.config.js
[warn] sites/next.skeleton.dev/tailwind.config.js
[warn] sites/skeleton.dev/src/app.html
[warn] sites/skeleton.dev/src/lib/components/DocsFooter/DocsFooter.svelte
[warn] sites/skeleton.dev/src/lib/components/DocsLogos/DocsLogoAnim.svelte
[warn] sites/skeleton.dev/src/lib/components/DocsPreview/DocsPreview.svelte
[warn] sites/skeleton.dev/src/lib/layouts/DocsShell/partials/Header.svelte
[warn] sites/skeleton.dev/src/lib/layouts/DocsShell/partials/PanelProps.svelte
[warn] sites/skeleton.dev/src/lib/layouts/DocsThemer/colors.ts
[warn] sites/skeleton.dev/src/lib/layouts/DocsThemer/DocsThemer.svelte
[warn] sites/skeleton.dev/src/lib/modals/DocsSearch/DocsSearch.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/actions/clipboard/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/actions/filters/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/actions/focus-trap/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/accordions/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/app-rail/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/app-shell/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/autocomplete/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/avatars/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/conic-gradients/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/file-buttons/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/input-chips/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/listboxes/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/paginators/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/progress-bars/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/radio-groups/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/ratings/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/slide-toggles/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/steppers/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/tables/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/tabs/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/components/tree-views/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/colors/+page.svelte
sites/skeleton.dev/src/routes/(inner)/docs/contributing/+page.svelte
[error] sites/skeleton.dev/src/routes/(inner)/docs/contributing/+page.svelte: CompileError: </a> attempted to close element that was already automatically closed by <a> (cannot nest <a> inside <a>)
[error] 30 | rel="noreferrer"
[error] 31 | >
[error] > 32 | Read Guide
[error] | ^
[error] 33 | </a>
[error] 34 | </a>
[error] 35 | <!-- GitHub: First Contributions -->
[error] (invalid-closing-tag-after-autoclose)
[warn] sites/skeleton.dev/src/routes/(inner)/docs/contributing/documentation/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/contributing/requirements/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/contributing/style-guide/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/contributing/sveld/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/figma/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/generator/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/get-started/SectionInstall.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/get-started/SectionTailwind.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/introduction/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/purgecss/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/quickstart/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/sponsorship/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/sponsorship/licensing/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/styling/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/tauri/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/themes/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/tokens/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/transitions/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/docs/variants/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/alerts/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/breadcrumbs/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/buttons/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/cards/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/chat/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/chips/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/core/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/forms/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/gradient-headings/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/image-layouts/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/lists/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/scroll-containers/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/tables/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/elements/typography/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/codeblocks/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/drawers/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/lightswitches/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/local-storage-stores/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/modals/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/popups/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/table-of-contents/+page.svelte
[warn] sites/skeleton.dev/src/routes/(inner)/utilities/toasts/+page.svelte
[warn] sites/skeleton.dev/src/routes/+error.svelte
[warn] sites/skeleton.dev/src/routes/home-partials/HomeHeroComponents.svelte
[warn] sites/skeleton.dev/src/routes/home-partials/HomeSvelteKit.svelte
[warn] sites/skeleton.dev/src/routes/home-partials/HomeTailwind.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/fieldsets/Colors.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/fieldsets/Spacing.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/fieldsets/Typography.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/panels/PanelForm.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/panels/PanelPreview.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/previews/CodeGen.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/previews/Elements.svelte
[warn] sites/themes.skeleton.dev/src/lib/components/previews/Typography.svelte
[warn] sites/themes.skeleton.dev/src/lib/constants.ts
[warn] sites/themes.skeleton.dev/src/lib/generator.svelte.ts
[warn] Code style issues found in 256 files. Run Prettier with --write to fix.
For reference, here's the .eslintrc.cjs
and .prettierrc.cjs
files I came up with (they have to be cjs
because the projects are modules):
.eslintrc.cjs
:
/** @type {import('eslint').Linter.Config} */
module.exports = {
root: true,
env: {
es2020: true,
node: true
},
extends: [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"prettier"
],
overrides: [
{
files: ["*.svelte"],
extends: ["plugin:svelte/recommended", "plugin:svelte/prettier"],
env: {
browser: true
},
parser: "svelte-eslint-parser",
parserOptions: {
parser: "@typescript-eslint/parser"
},
plugins: ["svelte"]
},
{
files: ["*.tsx"],
env: {
browser: true,
node: false
},
extends: [
"plugin:jsx-a11y/recommended",
"plugin:react/recommended",
"plugin:react/jsx-runtime",
"plugin:react-hooks/recommended"
],
parserOptions: {
ecmaFeatures: {
jsx: true
}
},
plugins: [
"jsx-a11y",
"react",
"react-compiler",
"react-hooks",
"react-refresh"
],
rules: {
"react-compiler/react-compiler": "error",
"react-refresh/only-export-components": ["warn", { allowConstantExport: true }]
},
settings: {
react: {
version: "detect"
}
}
}
],
parser: "@typescript-eslint/parser",
parserOptions: {
ecmaVersion: 2020,
extraFileExtensions: [".svelte"],
sourceType: "module"
},
plugins: ["@typescript-eslint"],
reportUnusedDisableDirectives: true,
rules: {
'no-empty-function': 'off',
'no-useless-escape': 'off',
'@typescript-eslint/no-empty-function': ['error', { allow: ['arrowFunctions'] }]
}
}
.prettierrc.cjs
:
/** @type {import('prettier').Config} */
module.exports = {
overrides: [
{
files: '*.astro',
options: {
parser: 'astro',
tabWidth: 4
}
},
{
files: '*.svelte',
options: {
parser: 'svelte',
tabWidth: 4
}
}
],
plugins: ['prettier-plugin-astro', 'prettier-plugin-svelte'],
printWidth: 140,
singleQuote: true,
trailingComma: 'none',
useTabs: true
}
from skeleton.
Also, ignore the mix of single and double quotes. I am just used to using double quotes, but Prettier will fix that when the time comes.
from skeleton.
@eagerestwolf just a reminder it's the weekend and I'm not likely to have much bandwidth to respond. But scanning through the posts above, we welcome testing and suggestions on what to change and implement. But in this specific regard, the team and I will make the final decision and likely implement solutions that balance well cross-framework. We're taking React into account, but it will need to stay in line with the other projects to ensure Adrian's suggestion above for consistently running this globally in the monorepo works as desired. So a bit of a balancing act.
Also just FYI tomorrow is a prep day and Tuesday a release for us, so it may be a couple days until we can review in detail. Feel free to push pause until we can catch up. Then we'll go from there. I'm sure I'll have some follow up questions!
Thanks for all the effort so far!
from skeleton.
Related Issues (20)
- Table of Contents: support setting scrollTarget, scrollOffset HOT 1
- AppRailTile on:click not working (v2.10.1) HOT 5
- Revert missing on:click event for App Rail Anchor Tile component
- NEXT: component consistency pass
- Missing import of popup HOT 3
- Carousels example HOT 2
- v3 Component API Revisions HOT 1
- NEXT: Revisit Tab Component and API HOT 1
- NEXT: Accordion missing a11y HOT 1
- NEXT: Dependency updates
- NEXT: Introduce the skeleton-a11y package
- Hover state on buttons in mobile stays after click in incoherent ways HOT 5
- AppRail HTML markup is invalid and not accessible HOT 1
- ListBoxItem HTML markup is invalid and not accessible HOT 2
- Disabled State for AppRailTiles
- NEXT resolve Astro doc site project dependency error HOT 2
- AppRailTile 2.10.2 update receives duplicated on:click events
- Modal documentation contains oudated reponse argument type
- Add Bluesky Social Link
- Autocomplete: onClear event handler HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from skeleton.