Add bundled version of `tailwindcss` and first-party plugins
parent
2594afbbde
commit
6fdef8616a
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
@ -22,6 +22,10 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"@parcel/watcher": "2.0.3",
|
||||
"@tailwindcss/aspect-ratio": "0.4.0",
|
||||
"@tailwindcss/forms": "0.4.0",
|
||||
"@tailwindcss/line-clamp": "0.3.0",
|
||||
"@tailwindcss/typography": "0.5.0",
|
||||
"@types/debounce": "1.2.0",
|
||||
"@types/node": "14.14.34",
|
||||
"@types/vscode": "1.52.0",
|
||||
|
@ -50,6 +54,7 @@
|
|||
"rimraf": "3.0.2",
|
||||
"semver": "7.3.2",
|
||||
"stack-trace": "0.0.10",
|
||||
"tailwindcss": "3.0.11",
|
||||
"terser": "4.6.12",
|
||||
"typescript": "4.2.4",
|
||||
"vscode-languageserver": "7.0.0",
|
||||
|
|
|
@ -2,6 +2,16 @@
|
|||
* Adapted from: https://github.com/elastic/require-in-the-middle
|
||||
*/
|
||||
import Module from 'module'
|
||||
import plugins from './plugins'
|
||||
|
||||
let bundledModules = {
|
||||
...plugins,
|
||||
'tailwindcss/colors': require('tailwindcss/colors'),
|
||||
'tailwindcss/defaultConfig': require('tailwindcss/defaultConfig'),
|
||||
'tailwindcss/defaultTheme': require('tailwindcss/defaultTheme'),
|
||||
'tailwindcss/resolveConfig': require('tailwindcss/resolveConfig'),
|
||||
'tailwindcss/plugin': require('tailwindcss/plugin'),
|
||||
}
|
||||
|
||||
export default class Hook {
|
||||
cache = {}
|
||||
|
@ -31,8 +41,22 @@ export default class Hook {
|
|||
return self._origRequire.apply(this, arguments)
|
||||
}
|
||||
|
||||
// @ts-ignore
|
||||
let filename = Module._resolveFilename(request, this)
|
||||
let filename
|
||||
|
||||
if (bundledModules.hasOwnProperty(request)) {
|
||||
try {
|
||||
// @ts-ignore
|
||||
filename = Module._resolveFilename(request, this)
|
||||
} catch (_) {
|
||||
// if (plugins.hasOwnProperty(request)) {
|
||||
// console.log(`Using bundled version of \`${request}\`: v${plugins[request].version}`)
|
||||
// }
|
||||
return bundledModules[request].module || bundledModules[request]
|
||||
}
|
||||
} else {
|
||||
// @ts-ignore
|
||||
filename = Module._resolveFilename(request, this)
|
||||
}
|
||||
|
||||
// return known patched modules immediately
|
||||
if (self.cache.hasOwnProperty(filename)) {
|
||||
|
|
|
@ -0,0 +1,18 @@
|
|||
export default {
|
||||
'@tailwindcss/aspect-ratio': {
|
||||
module: require('@tailwindcss/aspect-ratio'),
|
||||
version: require('@tailwindcss/aspect-ratio/package.json').version,
|
||||
},
|
||||
'@tailwindcss/forms': {
|
||||
module: require('@tailwindcss/forms'),
|
||||
version: require('@tailwindcss/forms/package.json').version,
|
||||
},
|
||||
'@tailwindcss/line-clamp': {
|
||||
module: require('@tailwindcss/line-clamp'),
|
||||
version: require('@tailwindcss/line-clamp/package.json').version,
|
||||
},
|
||||
'@tailwindcss/typography': {
|
||||
module: require('@tailwindcss/typography'),
|
||||
version: require('@tailwindcss/typography/package.json').version,
|
||||
},
|
||||
}
|
|
@ -0,0 +1,367 @@
|
|||
export default `/*
|
||||
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
|
||||
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
|
||||
*/
|
||||
|
||||
*,
|
||||
::before,
|
||||
::after {
|
||||
box-sizing: border-box; /* 1 */
|
||||
border-width: 0; /* 2 */
|
||||
border-style: solid; /* 2 */
|
||||
border-color: currentColor; /* 2 */
|
||||
}
|
||||
|
||||
::before,
|
||||
::after {
|
||||
--tw-content: '';
|
||||
}
|
||||
|
||||
/*
|
||||
1. Use a consistent sensible line-height in all browsers.
|
||||
2. Prevent adjustments of font size after orientation changes in iOS.
|
||||
3. Use a more readable tab size.
|
||||
4. Use the user's configured \`sans\` font-family by default.
|
||||
*/
|
||||
|
||||
html {
|
||||
line-height: 1.5; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
-moz-tab-size: 4; /* 3 */
|
||||
tab-size: 4; /* 3 */
|
||||
font-family: theme('fontFamily.sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); /* 4 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Remove the margin in all browsers.
|
||||
2. Inherit line-height from \`html\` so users can set them as a class directly on the \`html\` element.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0; /* 1 */
|
||||
line-height: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Add the correct height in Firefox.
|
||||
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
|
||||
3. Ensure horizontal rules are visible by default.
|
||||
*/
|
||||
|
||||
hr {
|
||||
height: 0; /* 1 */
|
||||
color: inherit; /* 2 */
|
||||
border-top-width: 1px; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
Add the correct text decoration in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
abbr:where([title]) {
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove the default font size and weight for headings.
|
||||
*/
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
/*
|
||||
Reset links to optimize for opt-in styling instead of opt-out.
|
||||
*/
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: inherit;
|
||||
}
|
||||
|
||||
/*
|
||||
Add the correct font weight in Edge and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Use the user's configured \`mono\` font family by default.
|
||||
2. Correct the odd \`em\` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp,
|
||||
pre {
|
||||
font-family: theme('fontFamily.mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/*
|
||||
Prevent \`sub\` and \`sup\` elements from affecting the line height in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
|
||||
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
|
||||
3. Remove gaps between table borders by default.
|
||||
*/
|
||||
|
||||
table {
|
||||
text-indent: 0; /* 1 */
|
||||
border-color: inherit; /* 2 */
|
||||
border-collapse: collapse; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Change the font styles in all browsers.
|
||||
2. Remove the margin in Firefox and Safari.
|
||||
3. Remove default padding in all browsers.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: inherit; /* 1 */
|
||||
color: inherit; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
padding: 0; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
Remove the inheritance of text transform in Edge and Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Correct the inability to style clickable types in iOS and Safari.
|
||||
2. Remove default button styles.
|
||||
*/
|
||||
|
||||
button,
|
||||
[type='button'],
|
||||
[type='reset'],
|
||||
[type='submit'] {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
background-color: transparent; /* 2 */
|
||||
background-image: none; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Use the modern Firefox focus style for all focusable elements.
|
||||
*/
|
||||
|
||||
:-moz-focusring {
|
||||
outline: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove the additional \`:invalid\` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
|
||||
*/
|
||||
|
||||
:-moz-ui-invalid {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/*
|
||||
Add the correct vertical alignment in Chrome and Firefox.
|
||||
*/
|
||||
|
||||
progress {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/*
|
||||
Correct the cursor style of increment and decrement buttons in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-inner-spin-button,
|
||||
::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Correct the odd appearance in Chrome and Safari.
|
||||
2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type='search'] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Remove the inner padding in Chrome and Safari on macOS.
|
||||
*/
|
||||
|
||||
::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Correct the inability to style clickable types in iOS and Safari.
|
||||
2. Change font properties to \`inherit\` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Add the correct display in Chrome and Safari.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/*
|
||||
Removes the default spacing and border for appropriate elements.
|
||||
*/
|
||||
|
||||
blockquote,
|
||||
dl,
|
||||
dd,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
hr,
|
||||
figure,
|
||||
p,
|
||||
pre {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
legend {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul,
|
||||
menu {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
Prevent resizing textareas horizontally by default.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
|
||||
2. Set the default placeholder color to the user's configured gray 400 color.
|
||||
*/
|
||||
|
||||
input::placeholder,
|
||||
textarea::placeholder {
|
||||
opacity: 1; /* 1 */
|
||||
color: theme('colors.gray.400', #9ca3af); /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Set the default cursor for buttons.
|
||||
*/
|
||||
|
||||
button,
|
||||
[role="button"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*
|
||||
Make sure disabled buttons don't get the pointer cursor.
|
||||
*/
|
||||
:disabled {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Make replaced elements \`display: block\` by default. (https://github.com/mozdevs/cssremedy/issues/14)
|
||||
2. Add \`vertical-align: middle\` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
|
||||
This can trigger a poorly considered lint error in some tools but is included by design.
|
||||
*/
|
||||
|
||||
img,
|
||||
svg,
|
||||
video,
|
||||
canvas,
|
||||
audio,
|
||||
iframe,
|
||||
embed,
|
||||
object {
|
||||
display: block; /* 1 */
|
||||
vertical-align: middle; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
|
||||
*/
|
||||
|
||||
img,
|
||||
video {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
Ensure the default browser behavior of the \`hidden\` attribute.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}`
|
|
@ -39,9 +39,7 @@ import type * as chokidar from 'chokidar'
|
|||
import findUp from 'find-up'
|
||||
import minimatch from 'minimatch'
|
||||
import resolveFrom, { setPnpApi } from './util/resolveFrom'
|
||||
import { /*postcssFallback,*/ AtRule, Container, Node, Result } from 'postcss'
|
||||
// import tailwindcssFallback from 'tailwindcss'
|
||||
// import resolveConfigFallback from 'tailwindcss/resolveConfig'
|
||||
import { AtRule, Container, Node, Result } from 'postcss'
|
||||
import Module from 'module'
|
||||
import Hook from './lib/hook'
|
||||
import semver from 'semver'
|
||||
|
@ -78,8 +76,20 @@ import { generateRules } from 'tailwindcss-language-service/src/util/jit'
|
|||
import { getColor } from 'tailwindcss-language-service/src/util/color'
|
||||
import * as culori from 'culori'
|
||||
import namedColors from 'color-name'
|
||||
import preflight from './lib/preflight'
|
||||
import tailwindPlugins from './lib/plugins'
|
||||
|
||||
let oldReadFileSync = fs.readFileSync
|
||||
// @ts-ignore
|
||||
fs.readFileSync = function (filename, ...args) {
|
||||
if (filename === path.join(__dirname, 'css/preflight.css')) {
|
||||
return preflight
|
||||
}
|
||||
return oldReadFileSync(filename, ...args)
|
||||
}
|
||||
|
||||
const CONFIG_FILE_GLOB = '{tailwind,tailwind.config}.{js,cjs}'
|
||||
const PACKAGE_GLOB = '{package.json,package-lock.json,yarn.lock,pnpm-lock.yaml}'
|
||||
const TRIGGER_CHARACTERS = [
|
||||
// class attributes
|
||||
'"',
|
||||
|
@ -269,7 +279,7 @@ async function createProjectService(
|
|||
}
|
||||
|
||||
let isConfigFile = minimatch(file, `**/${CONFIG_FILE_GLOB}`, { dot: true })
|
||||
let isPackageFile = minimatch(file, '**/package.json', { dot: true })
|
||||
let isPackageFile = minimatch(file, `**/${PACKAGE_GLOB}`, { dot: true })
|
||||
let isDependency = state.dependencies && state.dependencies.includes(change.file)
|
||||
|
||||
if (!isConfigFile && !isPackageFile && !isDependency) continue
|
||||
|
@ -312,7 +322,7 @@ async function createProjectService(
|
|||
})
|
||||
|
||||
connection.client.register(DidChangeWatchedFilesNotification.type, {
|
||||
watchers: [{ globPattern: `**/${CONFIG_FILE_GLOB}` }, { globPattern: '**/package.json' }],
|
||||
watchers: [{ globPattern: `**/${CONFIG_FILE_GLOB}` }, { globPattern: `**/${PACKAGE_GLOB}` }],
|
||||
})
|
||||
} else if (parcel.getBinding()) {
|
||||
let typeMap = {
|
||||
|
@ -340,7 +350,7 @@ async function createProjectService(
|
|||
})
|
||||
} else {
|
||||
let watch: typeof chokidar.watch = require('chokidar').watch
|
||||
chokidarWatcher = watch([`**/${CONFIG_FILE_GLOB}`, '**/package.json'], {
|
||||
chokidarWatcher = watch([`**/${CONFIG_FILE_GLOB}`, `**/${PACKAGE_GLOB}`], {
|
||||
cwd: folder,
|
||||
ignorePermissionErrors: true,
|
||||
ignoreInitial: true,
|
||||
|
@ -493,6 +503,7 @@ async function createProjectService(
|
|||
let jitModules: typeof state.modules.jit
|
||||
let tailwindcssVersion: string | undefined
|
||||
let postcssVersion: string | undefined
|
||||
let pluginVersions: string | undefined
|
||||
let browserslist: string[] | undefined
|
||||
let resolveConfigFn: (config: any) => any
|
||||
let featureFlags: FeatureFlags = { future: [], experimental: [] }
|
||||
|
@ -511,13 +522,25 @@ async function createProjectService(
|
|||
postcssVersion = __non_webpack_require__(postcssPkgPath).version
|
||||
tailwindcssVersion = __non_webpack_require__(tailwindcssPkgPath).version
|
||||
|
||||
pluginVersions = Object.keys(tailwindPlugins)
|
||||
.map((plugin) => {
|
||||
try {
|
||||
return __non_webpack_require__(resolveFrom(configDir, `${plugin}/package.json`)).version
|
||||
} catch (_) {
|
||||
return ''
|
||||
}
|
||||
})
|
||||
.join(',')
|
||||
|
||||
if (
|
||||
state.enabled &&
|
||||
postcssVersion === state.modules.postcss.version &&
|
||||
tailwindcssVersion === state.modules.tailwindcss.version &&
|
||||
pluginVersions === state.pluginVersions &&
|
||||
configPath === state.configPath &&
|
||||
configId === state.configId
|
||||
) {
|
||||
console.log('short circuit')
|
||||
return
|
||||
}
|
||||
|
||||
|
@ -674,17 +697,25 @@ async function createProjectService(
|
|||
} catch (_) {}
|
||||
}
|
||||
} catch (error) {
|
||||
throw new SilentError(error.message)
|
||||
// TODO: force mode
|
||||
// tailwindcss = tailwindcssFallback
|
||||
// resolveConfigFn = resolveConfigFallback
|
||||
// postcss = postcssFallback
|
||||
// applyComplexClasses = require('tailwindcss/lib/lib/substituteClassApplyAtRules')
|
||||
// tailwindcssVersion = '2.0.3'
|
||||
// postcssVersion = '8.2.6'
|
||||
// console.log(
|
||||
// `Failed to load workspace modules. Initializing with tailwindcss v${tailwindcssVersion}`
|
||||
// )
|
||||
tailwindcss = require('tailwindcss')
|
||||
resolveConfigFn = require('tailwindcss/resolveConfig')
|
||||
postcss = require('postcss')
|
||||
tailwindcssVersion = require('tailwindcss/package.json').version
|
||||
postcssVersion = require('postcss/package.json').version
|
||||
postcssSelectorParser = require('postcss-selector-parser')
|
||||
jitModules = {
|
||||
generateRules: { module: require('tailwindcss/lib/lib/generateRules').generateRules },
|
||||
createContext: {
|
||||
module: (state) =>
|
||||
require('tailwindcss/lib/lib/setupContextUtils').createContext(state.config),
|
||||
},
|
||||
expandApplyAtRules: {
|
||||
module: require('tailwindcss/lib/lib/expandApplyAtRules').default,
|
||||
},
|
||||
}
|
||||
console.log('Failed to load workspace modules.')
|
||||
console.log(`Using bundled version of \`tailwindcss\`: v${tailwindcssVersion}`)
|
||||
console.log(`Using bundled version of \`postcss\`: v${postcssVersion}`)
|
||||
}
|
||||
|
||||
state.configPath = configPath
|
||||
|
@ -698,6 +729,7 @@ async function createProjectService(
|
|||
state.browserslist = browserslist
|
||||
state.featureFlags = featureFlags
|
||||
state.version = tailwindcssVersion
|
||||
state.pluginVersions = pluginVersions
|
||||
|
||||
try {
|
||||
state.corePlugins = Object.keys(
|
||||
|
|
|
@ -94,6 +94,7 @@ export interface State {
|
|||
jit?: boolean
|
||||
jitContext?: any
|
||||
classList?: Array<[string, { color: culori.Color | KeywordColor | null }]>
|
||||
pluginVersions?: string
|
||||
// postcssPlugins?: { before: any[]; after: any[] }
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue