Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Add TailwindCSS type definitions#50921

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
sheetalkamat merged 12 commits intoDefinitelyTyped:masterfromdolanmiu:feat/tailwind2
Mar 8, 2021

Conversation

@dolanmiu
Copy link
Contributor

Please fill in this template.

Select one of these and delete the others:

If adding a new definition:

  • The package does not already provide its own types, or cannot have its.d.ts files generated via--declaration
  • If this is for an npm package, match the name. If not, do not conflict with the name of an npm package.
  • Create it withdts-gen --dt, not by basing it on an existing project.
  • Represents shape of module/librarycorrectly
  • tslint.jsonshould contain{ "extends": "dtslint/dt.json" }, and no additional rules.
  • tsconfig.jsonshould havenoImplicitAny,noImplicitThis,strictNullChecks, andstrictFunctionTypes set totrue.

Documentation for why:

https://tailwindcss.com/docs/configuration#referencing-in-java-script

See "Referencing in JavaScript"

AssisrMatheus, gairal, dolanmiu, matronator, dance2die, maxphillipsdev, safinsingh, f15u, jeremyswann, shannonrothe, and 2 more reacted with thumbs up emojimpsijm, dolanmiu, AssisrMatheus, matronator, dance2die, maxphillipsdev, safinsingh, nandi95, f15u, shannonrothe, and 2 more reacted with hooray emojinandi95 and anuraghazra reacted with eyes emoji
@typescript-bot
Copy link
Contributor

typescript-bot commentedJan 29, 2021
edited
Loading

@dolanmiu Thank you for submitting this PR!

This is a live comment which I will keep updated.

1 package in this PR

Code Reviews

This PR adds a new definition, so it needs to be reviewed by a DT maintainer before it can be merged.

Status

  • ✅ No merge conflicts
  • ✅ Continuous integration tests have passed
  • ❌ Only a DT maintainer can approve changes when there are new packages added

Once every item on this list is checked, I'll ask you for permission to merge and publish the changes.


Diagnostic Information: What the bot saw about this PR
{"type":"info","now":"-","pr_number":50921,"author":"dolanmiu","headCommitOid":"3b1d1f5606b2c4285967613d183139d4d083226f","lastPushDate":"2021-03-01T22:40:14.000Z","lastActivityDate":"2021-03-01T22:57:05.000Z","maintainerBlessed":false,"hasMergeConflict":false,"isFirstContribution":false,"popularityLevel":"Well-liked by everyone","pkgInfo": [    {"name":"tailwindcss","kind":"add","files": [        {"path":"types/tailwindcss/colors.d.ts","kind":"definition"        },        {"path":"types/tailwindcss/defaultTheme.d.ts","kind":"definition"        },        {"path":"types/tailwindcss/index.d.ts","kind":"definition"        },        {"path":"types/tailwindcss/resolveConfig.d.ts","kind":"definition"        },        {"path":"types/tailwindcss/tailwind-config.d.ts","kind":"definition"        },        {"path":"types/tailwindcss/tailwindcss-tests.ts","kind":"test"        },        {"path":"types/tailwindcss/tsconfig.json","kind":"package-meta-ok"        },        {"path":"types/tailwindcss/tslint.json","kind":"package-meta-ok"        }      ],"owners": [],"addedOwners": ["dolanmiu"      ],"deletedOwners": [],"popularityLevel":"Well-liked by everyone"    }  ],"reviews": [    {"type":"stale","reviewer":"amcasey","date":"2021-03-01T22:33:15.000Z","abbrOid":"8d91a82"    },    {"type":"stale","reviewer":"themagickoala","date":"2021-02-18T23:08:45.000Z","abbrOid":"8d91a82"    },    {"type":"stale","reviewer":"aivenkimmob","date":"2021-02-18T12:19:24.000Z","abbrOid":"8d91a82"    },    {"type":"stale","reviewer":"peterblazejewicz","date":"2021-02-14T19:50:05.000Z","abbrOid":"8d91a82"    },    {"type":"stale","reviewer":"sheetalkamat","date":"2021-01-29T22:55:24.000Z","abbrOid":"2049749"    }  ],"ciResult":"pass"}

@typescript-bot
Copy link
Contributor

🔔@dolanmiu — you're the only owner, but it would still be good if you find someone toreview this PR in the next few days, otherwise a maintainer will look at it. (And if you do find someone, maybe even recruit them to be a second owner to make future changes easier...)

@typescript-bottypescript-bot added New DefinitionThis PR creates a new definition package. Check ConfigChanges a module config files labelsJan 29, 2021
@danger-public
Copy link

danger-public commentedJan 29, 2021
edited
Loading

Inspecting the JavaScript source for this package found some properties that are not in the .d.ts files.
The check for missing properties isn't always right, so take this list as advice, not a requirement.

tailwindcss (unpkg)

was missing the following properties:

  1. postcss

Generated by 🚫dangerJS against8d91a82

@typescript-bot
Copy link
Contributor

👋Hi there! I’ve run some quick measurements against master and your PR. These metrics should help the humans reviewing this PR gauge whether it might negatively affect compile times or editor responsiveness for users who install these typings.

Let’s review the numbers, shall we?

These typings are for a package that doesn’t yet exist on master, so I don’t have anything to compare against yet! In the future, I’ll be able to compare PRs to tailwindcss with its source on master.

Comparison details 📊
Batch compilation
Type count3825
Assignability cache size396
Language service measurements
Samples taken522
Identifiers in tests522
getCompletionsAtPosition
    Mean duration (ms)72.8
    MeanCV16.2%
    Worst duration (ms)108.1
    Worst identifieropacity
getQuickInfoAtPosition
    Mean duration (ms)74.8
    MeanCV14.2%
    Worst duration (ms)116.3
    Worst identifierwhite
System information
Node versionv14.15.4
CPU count2
CPU speed2.095 GHz
CPU modelIntel(R) Xeon(R) Platinum 8171M CPU @ 2.60GHz
CPU Architecturex64
Memory6.8 GiB
Platformlinux
Release4.15.0-1103-azure

@typescript-bottypescript-bot added the Revision neededThis PR needs code changes before it can be merged. labelJan 29, 2021
@typescript-bot
Copy link
Contributor

@dolanmiu One or more reviewers has requested changes. Please address their comments. I'll be back once they sign off or you've pushed new commits. Thank you!

@dolanmiu
Copy link
ContributorAuthor

Inspecting the JavaScript source for this package found some properties that are not in the .d.ts files.
The check for missing properties isn't always right, so take this list as advice, not a requirement.

tailwindcss (unpkg)

was missing the following properties:

  1. The declaration doesn't match the JavaScript module 'tailwindcss'. Reason:
    The JavaScript module can be called or constructed, but the declaration module cannot.

The most common way to resolve this error is to use 'export =' syntax.
To learn more about 'export =' syntax, seehttps://www.typescriptlang.org/docs/handbook/modules.html#export--and-import--require.

  1. postcss

Generated by 🚫dangerJS against2049749

This is now done

@typescript-bottypescript-bot removed Check ConfigChanges a module config files Revision neededThis PR needs code changes before it can be merged. labelsJan 30, 2021
@typescript-bot
Copy link
Contributor

@sheetalkamat Thank you for reviewing this PR! The author has pushed new commits since your last review. Could you take another look and submit a fresh review?

@dolanmiu
Copy link
ContributorAuthor

@sheetalkamat Could you take a look again please?

@@ -0,0 +1,1186 @@
export type Variant =
Copy link
Contributor

Choose a reason for hiding this comment

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

This appears to be a types-only file without a corresponding module in the underlying library. Am I reading that correctly? Is the goal just to prevent consumers from accidentally importing the types? If not, why not just include them in index.d.ts? Possible issues: if a consumer does import this file, will the import still be present at runtime? What happens if the underlying library adds a module with this name (unlikely, since it doesn't seem to follow their naming conventions)?

peterblazejewicz reacted with thumbs up emoji
Copy link
ContributorAuthor

@dolanmiudolanmiuFeb 2, 2021
edited
Loading

Choose a reason for hiding this comment

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

Separation of concerns

tailwind-config.d.ts is really big (way over 1000+ lines long), and I did not want to pollute index.d.ts

This library does not export anything of the sort, I had to manually infer this from the documentation.

Similar to how in@types/webpack type definitions, there is aConfiguration interface which is no where to be found inwebpack itself. This is my goal

Copy link
Contributor

Choose a reason for hiding this comment

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

Sorry, I'm not sure I understand. What concerns are you separating? It seems like tailwind-config.d.ts contains the types that are necessary for the declarations in index.d.ts. If you don't want consumers to see the helper types, just don't export them.

I don't follow your point about webpack. There's nothing wrong with adding types not found in the underlying library - that's the point of DefinitelyTyped. My concern is with adding apackage not found in the underlying library. Does webpack do that?

Copy link
ContributorAuthor

Choose a reason for hiding this comment

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

This type definition has zero dependencies, so surely this would not be a problem?

Ok, I could movetailwind-config.d.ts intoindex.d.ts if that is better? what do you think?

Copy link
Contributor

Choose a reason for hiding this comment

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

I'm not sure what you mean by "zero dependencies". If you mean that it doesn't depend on anything, I don't think that's relevant to the file organization. If you mean that nothing depends on it, I think that's only because it hasn't been merged yet - it seems to be quite a popular package.

Yes, as@peterblazejewicz and I have explained, having modules that don't exist in the underlying library makes it more likely that a user will consume it incorrectly and have problems at runtime.

@@ -0,0 +1,5 @@
import { TailwindConfig } from './tailwind-config';

Choose a reason for hiding this comment

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

there is no './tailwind-config.jsin the source, why this cannot belib/util/resolveConfig` import?

Copy link
ContributorAuthor

Choose a reason for hiding this comment

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

It can't belib/util/resolveConfig because it has to be:

importresolveConfigfrom'tailwindcss/resolveConfig'

Is this what you mean?

Source:

https://tailwindcss.com/docs/configuration#referencing-in-java-script

Choose a reason for hiding this comment

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

This is how to consume the package IMO, not how it's written:
https://github.com/tailwindlabs/tailwindcss/blob/master/resolveConfig.js#L4
https://unpkg.com/tailwindcss@2.0.2/resolveConfig.js
this methods returns outcome of calling theresolvveConfigObjects:

constresolveConfigObjects=require('./lib/util/resolveConfig').default

you can of course skip 'lib/util/resolveConfig' details and just write shared types somewhere. But I'd not create some artificial file for those, just put them into 'index.d.ts' as shared interfaces (types).

amcasey reacted with thumbs up emoji
Co-authored-by: Piotr Błażejewicz (Peter Blazejewicz) <peterblazejewicz@users.noreply.github.com>
Co-authored-by: Piotr Błażejewicz (Peter Blazejewicz) <peterblazejewicz@users.noreply.github.com>
@typescript-bot
Copy link
Contributor

@peterblazejewicz,@amcasey,@sheetalkamat Thank you for reviewing this PR! The author has pushed new commits since your last review. Could you take another look and submit a fresh review?

@peterblazejewicz
Copy link
Member

Where is default theme?

constdefaultTheme=require('tailwindcss/defaultTheme')

it's the object within thetheme property of that default config interfacew

@peterblazejewicz
Copy link
Member

peterblazejewicz commentedFeb 2, 2021
edited
Loading

Where is:

constcolors=require('tailwindcss/colors')

this one defaines shapes of the colors used by default config theme

@typescript-bottypescript-bot removed the Other ApprovedThis PR was reviewed and signed-off by a community member. labelFeb 8, 2021
@typescript-bot
Copy link
Contributor

@peterblazejewicz,@sheetalkamat Thank you for reviewing this PR! The author has pushed new commits since your last review. Could you take another look and submit a fresh review?

@dolanmiu
Copy link
ContributorAuthor

dolanmiu commentedFeb 9, 2021
edited
Loading

@peterblazejewicz My concern is that it will inflate and pollute index.d.ts, and violate separation of concerns

tailwind-config.d.ts is absolutely massive. I am trying to split the code into logical chunks to make future work more maintainable

Look at the following as an example:
https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/jsforce
https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/nodegit

@typescript-bottypescript-bot added the Other ApprovedThis PR was reviewed and signed-off by a community member. labelFeb 14, 2021
Copy link

@aivenkimmobaivenkimmob left a comment

Choose a reason for hiding this comment

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

I'd be tempted to tick the "request changes" but not sure if I misunderstood the big picture here.

Copy link
Contributor

@amcaseyamcasey left a comment

Choose a reason for hiding this comment

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

Can you please address@aivenkimmob's question? The types shouldn't preclude common usage patterns.

dolanmiu reacted with thumbs up emoji
@typescript-bottypescript-bot added Revision neededThis PR needs code changes before it can be merged. and removed Maintainer Approved Other ApprovedThis PR was reviewed and signed-off by a community member. Self MergeThis PR can now be self-merged by the PR author or an owner labelsFeb 18, 2021
@typescript-bot
Copy link
Contributor

@dolanmiu One or more reviewers has requested changes. Please address their comments. I'll be back once they sign off or you've pushed new commits. Thank you!

@dolanmiu
Copy link
ContributorAuthor

Can you please address@aivenkimmob's question? The types shouldn't preclude common usage patterns.

done

aivenkimmob, programbo, and nandi95 reacted with thumbs up emoji

@dolanmiu
Copy link
ContributorAuthor

Could someone merge this in? Everything is addressed

Co-authored-by: Piotr Błażejewicz (Peter Blazejewicz) <peterblazejewicz@users.noreply.github.com>
@typescript-bottypescript-bot removed the Revision neededThis PR needs code changes before it can be merged. labelMar 1, 2021
@dolanmiu
Copy link
ContributorAuthor

@amcasey I had to revert theexport = resolveConfig; change onresolveConfig.d.ts as it broke the tests

ERROR: 1:8  expect  TypeScript@4.2 compile error: Module '"/Users/dmiu/DefinitelyTyped/types/tailwindcss/resolveConfig"' can only be default-imported using the 'esModuleInterop' flag

@typescript-bottypescript-bot added the The CI failedWhen GH Actions fails labelMar 1, 2021
@typescript-bot
Copy link
Contributor

@dolanmiu The CI build failed! Pleasereview the logs for more information.

Once you've pushed the fixes, the build will automatically re-run. Thanks!

@typescript-bottypescript-bot removed the The CI failedWhen GH Actions fails labelMar 1, 2021
@typescript-bot
Copy link
Contributor

@amcasey,@themagickoala,@aivenkimmob,@peterblazejewicz,@sheetalkamat Thank you for reviewing this PR! The author has pushed new commits since your last review. Could you take another look and submit a fresh review?

@amcasey
Copy link
Contributor

@amcasey I had to revert theexport = resolveConfig; change onresolveConfig.d.ts as it broke the tests

ERROR: 1:8  expect  TypeScript@4.2 compile error: Module '"/Users/dmiu/DefinitelyTyped/types/tailwindcss/resolveConfig"' can only be default-imported using the 'esModuleInterop' flag

The error is correct - you need a default export to use a default import. I'm confused because theunderlying code does not appear to have a default export. However, as you point out, the docs suggest doing it this way, so I'm fine with reverting the export.

dolanmiu reacted with thumbs up emoji

@sheetalkamatsheetalkamat merged commita189565 intoDefinitelyTyped:masterMar 8, 2021
@typescript-bot
Copy link
Contributor

I just published@types/tailwindcss@2.0.0 to npm.

dolanmiu, safinsingh, balaji043, danielduckworth, and athammer reacted with thumbs up emojif15u, programbo, dolanmiu, safinsingh, and athammer reacted with hooray emojif15u, dolanmiu, and safinsingh reacted with heart emojiSergyus and safinsingh reacted with rocket emojimohatt reacted with eyes emoji

Sign up for freeto join this conversation on GitHub. Already have an account?Sign in to comment

Reviewers

@peterblazejewiczpeterblazejewiczpeterblazejewicz approved these changes

@sheetalkamatsheetalkamatAwaiting requested review from sheetalkamat

@amcaseyamcaseyAwaiting requested review from amcasey

+2 more reviewers

@themagickoalathemagickoalathemagickoala left review comments

@aivenkimmobaivenkimmobaivenkimmob left review comments

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

New DefinitionThis PR creates a new definition package.

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

8 participants

@dolanmiu@typescript-bot@danger-public@peterblazejewicz@amcasey@sheetalkamat@themagickoala@aivenkimmob

[8]ページ先頭

©2009-2025 Movatter.jp