Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions packages/knip/fixtures/plugins/ladle/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"name": "@fixtures/ladle",
"scripts": {
"dev": "ladle serve --port 4123",
"build": "ladle build"
},
"dependencies": {
"@ladle/react": "*",
"react": "*",
"react-dom": "*"
},
"devDependencies": {
"@types/node": "*",
"@types/react": "*",
"@types/react-dom": "*",
"typescript": "*"
}
}
4 changes: 4 additions & 0 deletions packages/knip/schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -356,6 +356,10 @@
"title": "Jest plugin configuration (https://knip.dev/reference/plugins/jest)",
"$ref": "#/definitions/plugin"
},
"ladle": {
"title": "ladle plugin configuration (https://knip.dev/reference/plugins/ladle)",
"$ref": "#/definitions/plugin"
},
"lefthook": {
"title": "lefthook plugin configuration (https://knip.dev/reference/plugins/lefthook)",
"$ref": "#/definitions/plugin"
Expand Down
1 change: 1 addition & 0 deletions packages/knip/src/ConfigurationValidator.ts
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,7 @@ const pluginsSchema = z.object({
'graphql-codegen': pluginSchema,
husky: pluginSchema,
jest: pluginSchema,
ladle: pluginSchema,
lefthook: pluginSchema,
'lint-staged': pluginSchema,
linthtml: pluginSchema,
Expand Down
1 change: 1 addition & 0 deletions packages/knip/src/plugins/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ export { default as githubActions } from './github-actions/index.js';
export { default as graphqlCodegen } from './graphql-codegen/index.js';
export { default as husky } from './husky/index.js';
export { default as jest } from './jest/index.js';
export { default as ladle } from './ladle/index.js';
export { default as lefthook } from './lefthook/index.js';
export { default as linthtml } from './linthtml/index.js';
export { default as lintStaged } from './lint-staged/index.js';
Expand Down
40 changes: 40 additions & 0 deletions packages/knip/src/plugins/ladle/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import type { EnablerPatterns } from '#p/types/config.js';
import type { IsPluginEnabled, Plugin, ResolveEntryPaths } from '#p/types/plugins.js';
import { hasDependency } from '#p/util/plugin.js';
import type { LadleConfig } from './types.js';
import { toEntryPattern } from '../../util/protocols.js';

// https://ladle.dev/docs/config

const title = 'ladle';

const enablers: EnablerPatterns = [/^@ladle\//];

const isEnabled: IsPluginEnabled = ({ dependencies }) => hasDependency(dependencies, enablers);

const config = ['.ladle/config.{mjs,js,ts}'];

const stories: string[] = ['**/*.@(stories.@(mdx|js|jsx|mjs|ts|tsx))'];
const restEntry: string[] = ['.ladle/components.{js,jsx,ts,tsx}', 'head.html'];
const entry: string[] = [...restEntry, ...stories];

const project = ['.ladle/**/*.{js,jsx,ts,tsx}'];

const resolveEntryPaths: ResolveEntryPaths<LadleConfig> = async localConfig => {
const localStories = typeof localConfig.stories === 'string' ? [localConfig.stories] : localConfig.stories;
const localViteConfig = localConfig.viteConfig ? [localConfig.viteConfig] : [];
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Vite config should be handled by the Vite plugin, so I think we can just ignore it here? Btw it would need be a config file, not an entry file.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For ladle it might be necessary to have a dedicated / different viteConfig file. So in my case I have ~/.vite.config.ts and for ladle ~/.ladle/vite.config.ts. Only if you don't use the default one, this parameter is set and then should be respected. Otherwise, I get it listed as "unused file".

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK in that case I think it's interesting to look into using the resolveConfig function of the Vitest plugin (which is basically the same as the Vite plugin).

Simplified inside resolveConfig: const viteDeps = resolveConfig(await load(localConfig.viteConfig))

Does that make sense?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changed 👍 I wasn't aware that it is allowed to use other plugins.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

… I cannot get rid of the message that the file is unused, stuck here.

Unused files (1)
.ladle/vite.config.ts

I also tried things like

const resolveConfig: ResolveConfig<LadleConfig> = async (localConfig, options) =>
  resolveVitestConfig(localConfig.viteConfig ? await load(join(process.cwd(), localConfig.viteConfig)) : [], options);

Maybe someone with more insights can help here? 😇

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Perhaps confusingly, loading the file does not "use" it (because it's not part of the dependency graph). For this you could add it as an entry file (contrary to what I said earlier, sorry, but that was for another reason).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I re-added it additionally as an entry file 👍


const patterns = [...restEntry, ...(localStories ?? stories), ...localViteConfig];

return patterns.map(toEntryPattern);
};

export default {
title,
enablers,
isEnabled,
config,
entry,
project,
resolveEntryPaths,
} satisfies Plugin;
4 changes: 4 additions & 0 deletions packages/knip/src/plugins/ladle/types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
export type LadleConfig = {
stories?: string | string[];
viteConfig?: string;
};
31 changes: 31 additions & 0 deletions packages/knip/test/plugins/ladle.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import { test } from 'bun:test';
import assert from 'node:assert/strict';
import { main } from '../../src/index.js';
import { resolve } from '../../src/util/path.js';
import baseArguments from '../helpers/baseArguments.js';
import baseCounters from '../helpers/baseCounters.js';

const cwd = resolve('fixtures/plugins/ladle');

test('Find dependencies with the ladle plugin', async () => {
const { issues, counters } = await main({
...baseArguments,
cwd,
});

assert(issues.dependencies['package.json']['@ladle/react']);
assert(issues.dependencies['package.json']['react']);
assert(issues.dependencies['package.json']['react-dom']);
assert(issues.devDependencies['package.json']['@types/react']);
assert(issues.devDependencies['package.json']['@types/react-dom']);
assert(issues.binaries['package.json']['ladle']);

assert.deepEqual(counters, {
...baseCounters,
binaries: 1,
dependencies: 3,
devDependencies: 2,
processed: 0,
total: 0,
});
});