@compiled/vite-plugin 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +60 -0
- package/dist/index.d.ts +11 -0
- package/dist/index.js +221 -0
- package/dist/index.js.map +1 -0
- package/dist/types.d.ts +41 -0
- package/dist/types.js +3 -0
- package/dist/types.js.map +1 -0
- package/dist/utils.d.ts +11 -0
- package/dist/utils.js +57 -0
- package/dist/utils.js.map +1 -0
- package/package.json +48 -0
- package/src/__tests__/extraction.test.ts +415 -0
- package/src/__tests__/plugin.test.ts +346 -0
- package/src/index.ts +276 -0
- package/src/types.ts +44 -0
- package/src/utils.ts +40 -0
package/README.md
ADDED
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
# @compiled/vite-plugin
|
|
2
|
+
|
|
3
|
+
Vite plugin for Compiled.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @compiled/vite-plugin @compiled/react
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
Add the plugin to your `vite.config.ts`:
|
|
14
|
+
|
|
15
|
+
```js
|
|
16
|
+
import { defineConfig } from 'vite';
|
|
17
|
+
import react from '@vitejs/plugin-react';
|
|
18
|
+
import compiled from '@compiled/vite-plugin';
|
|
19
|
+
|
|
20
|
+
export default defineConfig({
|
|
21
|
+
plugins: [compiled(), react()],
|
|
22
|
+
});
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
**Important:** The Compiled plugin must be placed **before** the React plugin. It is enforced by default via `pre` ordering.
|
|
26
|
+
|
|
27
|
+
## Configuration
|
|
28
|
+
|
|
29
|
+
Common options:
|
|
30
|
+
|
|
31
|
+
```ts
|
|
32
|
+
compiled({
|
|
33
|
+
extract: true, // Extract CSS to file (production only)
|
|
34
|
+
importReact: false, // Set false when using automatic JSX runtime
|
|
35
|
+
ssr: false, // Enable SSR mode
|
|
36
|
+
sortAtRules: true, // Sort media queries for extraction
|
|
37
|
+
sortShorthand: true, // Sort shorthand properties for extraction
|
|
38
|
+
});
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
## CSS Extraction
|
|
42
|
+
|
|
43
|
+
Enable CSS extraction for production builds:
|
|
44
|
+
|
|
45
|
+
```ts
|
|
46
|
+
export default defineConfig({
|
|
47
|
+
plugins: [
|
|
48
|
+
compiled({
|
|
49
|
+
extract: true, // Generates compiled.css
|
|
50
|
+
}),
|
|
51
|
+
react(),
|
|
52
|
+
],
|
|
53
|
+
});
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
Extraction is automatically disabled in development for optimal HMR.
|
|
57
|
+
|
|
58
|
+
## More Information
|
|
59
|
+
|
|
60
|
+
Detailed documentation and examples can be [found on the documentation website](https://compiledcssinjs.com/docs/pkg-vite-plugin).
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { PluginOptions } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Compiled Vite plugin.
|
|
4
|
+
*
|
|
5
|
+
* Transforms CSS-in-JS to atomic CSS at build time using Babel.
|
|
6
|
+
*
|
|
7
|
+
* @param userOptions - Plugin configuration options
|
|
8
|
+
* @returns Vite plugin object
|
|
9
|
+
*/
|
|
10
|
+
export default function compiledVitePlugin(userOptions?: PluginOptions): any;
|
|
11
|
+
export type { PluginOptions as VitePluginOptions };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,221 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
3
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
4
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
5
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
6
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
7
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
8
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
9
|
+
});
|
|
10
|
+
};
|
|
11
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
|
+
const core_1 = require("@babel/core");
|
|
13
|
+
const css_1 = require("@compiled/css");
|
|
14
|
+
const utils_1 = require("@compiled/utils");
|
|
15
|
+
const utils_2 = require("./utils");
|
|
16
|
+
/**
|
|
17
|
+
* Compiled Vite plugin.
|
|
18
|
+
*
|
|
19
|
+
* Transforms CSS-in-JS to atomic CSS at build time using Babel.
|
|
20
|
+
*
|
|
21
|
+
* @param userOptions - Plugin configuration options
|
|
22
|
+
* @returns Vite plugin object
|
|
23
|
+
*/
|
|
24
|
+
function compiledVitePlugin(userOptions = {}) {
|
|
25
|
+
const options = Object.assign({
|
|
26
|
+
// Vite-specific
|
|
27
|
+
bake: true, extract: false, transformerBabelPlugins: undefined, ssr: false, extractStylesToDirectory: undefined, sortShorthand: true,
|
|
28
|
+
// Babel-inherited
|
|
29
|
+
importReact: true, nonce: undefined, importSources: undefined, optimizeCss: true, resolver: undefined, extensions: undefined, parserBabelPlugins: undefined, addComponentName: false, classNameCompressionMap: undefined, processXcss: undefined, increaseSpecificity: undefined, sortAtRules: true, classHashPrefix: undefined, flattenMultipleSelectors: undefined }, userOptions);
|
|
30
|
+
// Storage for collected style rules during transformation
|
|
31
|
+
const collectedStyleRules = new Set();
|
|
32
|
+
// Store the emitted CSS filename for HTML injection
|
|
33
|
+
// This gets set in generateBundle after the file is emitted
|
|
34
|
+
let extractedCssFileName;
|
|
35
|
+
// Name used for the extracted CSS asset
|
|
36
|
+
const EXTRACTED_CSS_NAME = 'compiled-extracted.css';
|
|
37
|
+
return {
|
|
38
|
+
name: '@compiled/vite-plugin',
|
|
39
|
+
enforce: 'pre',
|
|
40
|
+
transform(code, id) {
|
|
41
|
+
var _a, _b, _c, _d, _e;
|
|
42
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
43
|
+
// Filter out node_modules (except for specific includes if needed)
|
|
44
|
+
if (id.includes('/node_modules/@compiled/react')) {
|
|
45
|
+
return null;
|
|
46
|
+
}
|
|
47
|
+
// Only process JS/TS/JSX/TSX files
|
|
48
|
+
if (!/\.[jt]sx?$/.test(id)) {
|
|
49
|
+
return null;
|
|
50
|
+
}
|
|
51
|
+
const importSources = [...utils_1.DEFAULT_IMPORT_SOURCES, ...(options.importSources || [])];
|
|
52
|
+
// Bail early if Compiled (via an importSource) isn't in the module
|
|
53
|
+
if (!importSources.some((name) => code.includes(name))) {
|
|
54
|
+
return null;
|
|
55
|
+
}
|
|
56
|
+
try {
|
|
57
|
+
const includedFiles = [];
|
|
58
|
+
// Parse to AST using Babel
|
|
59
|
+
const ast = yield (0, core_1.parseAsync)(code, {
|
|
60
|
+
filename: id,
|
|
61
|
+
babelrc: false,
|
|
62
|
+
configFile: false,
|
|
63
|
+
caller: { name: 'compiled' },
|
|
64
|
+
rootMode: 'upward-optional',
|
|
65
|
+
parserOpts: {
|
|
66
|
+
plugins: (_a = options.parserBabelPlugins) !== null && _a !== void 0 ? _a : utils_1.DEFAULT_PARSER_BABEL_PLUGINS,
|
|
67
|
+
},
|
|
68
|
+
plugins: (_b = options.transformerBabelPlugins) !== null && _b !== void 0 ? _b : undefined,
|
|
69
|
+
});
|
|
70
|
+
if (!ast) {
|
|
71
|
+
return null;
|
|
72
|
+
}
|
|
73
|
+
// Disable stylesheet extraction in development mode
|
|
74
|
+
const isDevelopment = process.env.NODE_ENV === 'development';
|
|
75
|
+
const extract = options.extract && !isDevelopment;
|
|
76
|
+
// Transform using the Compiled Babel Plugin
|
|
77
|
+
const result = yield (0, core_1.transformFromAstAsync)(ast, code, {
|
|
78
|
+
babelrc: false,
|
|
79
|
+
configFile: false,
|
|
80
|
+
sourceMaps: true,
|
|
81
|
+
filename: id,
|
|
82
|
+
parserOpts: {
|
|
83
|
+
plugins: (_c = options.parserBabelPlugins) !== null && _c !== void 0 ? _c : utils_1.DEFAULT_PARSER_BABEL_PLUGINS,
|
|
84
|
+
},
|
|
85
|
+
plugins: [
|
|
86
|
+
...((_d = options.transformerBabelPlugins) !== null && _d !== void 0 ? _d : []),
|
|
87
|
+
options.bake && [
|
|
88
|
+
'@compiled/babel-plugin',
|
|
89
|
+
Object.assign(Object.assign({}, options), {
|
|
90
|
+
// Turn off compressing class names if stylesheet extraction is off
|
|
91
|
+
classNameCompressionMap: extract && options.classNameCompressionMap, onIncludedFiles: (files) => includedFiles.push(...files), resolver: options.resolver ? options.resolver : (0, utils_2.createDefaultResolver)(options), cache: false }),
|
|
92
|
+
],
|
|
93
|
+
extract && [
|
|
94
|
+
'@compiled/babel-plugin-strip-runtime',
|
|
95
|
+
{
|
|
96
|
+
compiledRequireExclude: options.ssr || extract,
|
|
97
|
+
extractStylesToDirectory: options.extractStylesToDirectory,
|
|
98
|
+
},
|
|
99
|
+
],
|
|
100
|
+
].filter(utils_1.toBoolean),
|
|
101
|
+
caller: {
|
|
102
|
+
name: 'compiled',
|
|
103
|
+
},
|
|
104
|
+
});
|
|
105
|
+
// Store metadata for CSS extraction if enabled
|
|
106
|
+
if (extract && (result === null || result === void 0 ? void 0 : result.metadata)) {
|
|
107
|
+
const metadata = result.metadata;
|
|
108
|
+
// Collect style rules from this file
|
|
109
|
+
if (metadata.styleRules && metadata.styleRules.length > 0) {
|
|
110
|
+
metadata.styleRules.forEach((rule) => collectedStyleRules.add(rule));
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
// Return transformed code and source map
|
|
114
|
+
if (result === null || result === void 0 ? void 0 : result.code) {
|
|
115
|
+
return {
|
|
116
|
+
code: result.code,
|
|
117
|
+
map: (_e = result.map) !== null && _e !== void 0 ? _e : null,
|
|
118
|
+
};
|
|
119
|
+
}
|
|
120
|
+
return null;
|
|
121
|
+
}
|
|
122
|
+
catch (e) {
|
|
123
|
+
// Throw error to be displayed by Vite
|
|
124
|
+
const error = e;
|
|
125
|
+
this.error({
|
|
126
|
+
message: `[@compiled/vite-plugin] Failed to transform: ${error.message}`,
|
|
127
|
+
stack: error.stack,
|
|
128
|
+
});
|
|
129
|
+
}
|
|
130
|
+
});
|
|
131
|
+
},
|
|
132
|
+
generateBundle(_outputOptions, bundle) {
|
|
133
|
+
// Post-process CSS assets to apply Compiled's sorting and deduplication
|
|
134
|
+
const isDevelopment = process.env.NODE_ENV === 'development';
|
|
135
|
+
const extract = options.extract && !isDevelopment;
|
|
136
|
+
// Process each CSS asset in the bundle
|
|
137
|
+
for (const [fileName, output] of Object.entries(bundle)) {
|
|
138
|
+
// Only process CSS assets
|
|
139
|
+
if (!fileName.endsWith('.css') || output.type !== 'asset') {
|
|
140
|
+
continue;
|
|
141
|
+
}
|
|
142
|
+
const asset = output;
|
|
143
|
+
const cssContent = asset.source;
|
|
144
|
+
// Check if this CSS contains Compiled atomic classes (starts with underscore)
|
|
145
|
+
// This is a heuristic to identify CSS that came from .compiled.css files
|
|
146
|
+
if (cssContent.includes('._')) {
|
|
147
|
+
try {
|
|
148
|
+
// Apply Compiled's CSS sorting and deduplication
|
|
149
|
+
const sortConfig = {
|
|
150
|
+
sortAtRulesEnabled: options.sortAtRules,
|
|
151
|
+
sortShorthandEnabled: options.sortShorthand,
|
|
152
|
+
};
|
|
153
|
+
const sortedCss = (0, css_1.sort)(cssContent, sortConfig);
|
|
154
|
+
// Update the asset with sorted CSS
|
|
155
|
+
asset.source = sortedCss;
|
|
156
|
+
}
|
|
157
|
+
catch (error) {
|
|
158
|
+
const err = error;
|
|
159
|
+
this.warn({
|
|
160
|
+
message: `[@compiled/vite-plugin] Failed to sort CSS in ${fileName}: ${err.message}`,
|
|
161
|
+
});
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
// Also emit extracted styles if we collected any from local code
|
|
166
|
+
if (extract && collectedStyleRules.size > 0) {
|
|
167
|
+
try {
|
|
168
|
+
// Convert Set to array and sort for determinism
|
|
169
|
+
const allRules = Array.from(collectedStyleRules).sort();
|
|
170
|
+
// Join all rules and apply CSS sorting
|
|
171
|
+
const combinedCss = allRules.join('\n');
|
|
172
|
+
const sortConfig = {
|
|
173
|
+
sortAtRulesEnabled: options.sortAtRules,
|
|
174
|
+
sortShorthandEnabled: options.sortShorthand,
|
|
175
|
+
};
|
|
176
|
+
const sortedCss = (0, css_1.sort)(combinedCss, sortConfig);
|
|
177
|
+
// Emit the CSS file with content-based naming
|
|
178
|
+
// Vite will add a content hash to the filename automatically
|
|
179
|
+
this.emitFile({
|
|
180
|
+
type: 'asset',
|
|
181
|
+
name: EXTRACTED_CSS_NAME,
|
|
182
|
+
source: sortedCss,
|
|
183
|
+
});
|
|
184
|
+
// Mark that we've emitted the file so transformIndexHtml can inject it
|
|
185
|
+
// The actual filename will be determined in transformIndexHtml from the bundle
|
|
186
|
+
extractedCssFileName = EXTRACTED_CSS_NAME;
|
|
187
|
+
}
|
|
188
|
+
catch (error) {
|
|
189
|
+
const err = error;
|
|
190
|
+
this.warn({
|
|
191
|
+
message: `[@compiled/vite-plugin] Failed to generate CSS bundle: ${err.message}`,
|
|
192
|
+
});
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
},
|
|
196
|
+
transformIndexHtml(_html, ctx) {
|
|
197
|
+
// Inject the extracted CSS file into HTML if it was emitted
|
|
198
|
+
if (!extractedCssFileName || !ctx.bundle) {
|
|
199
|
+
return [];
|
|
200
|
+
}
|
|
201
|
+
// Find the emitted CSS asset in the bundle by its name
|
|
202
|
+
// The actual fileName will have a content hash added by Vite
|
|
203
|
+
const cssAsset = Object.values(ctx.bundle).find((asset) => asset.type === 'asset' && asset.name === EXTRACTED_CSS_NAME);
|
|
204
|
+
if (!cssAsset) {
|
|
205
|
+
return [];
|
|
206
|
+
}
|
|
207
|
+
return [
|
|
208
|
+
{
|
|
209
|
+
tag: 'link',
|
|
210
|
+
attrs: {
|
|
211
|
+
rel: 'stylesheet',
|
|
212
|
+
href: `/${cssAsset.fileName}`,
|
|
213
|
+
},
|
|
214
|
+
injectTo: 'head',
|
|
215
|
+
},
|
|
216
|
+
];
|
|
217
|
+
},
|
|
218
|
+
};
|
|
219
|
+
}
|
|
220
|
+
exports.default = compiledVitePlugin;
|
|
221
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/types.d.ts
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import type { PluginItem } from '@babel/core';
|
|
2
|
+
import type { PluginOptions as BabelPluginOptions } from '@compiled/babel-plugin';
|
|
3
|
+
/**
|
|
4
|
+
* Vite plugin options extending the babel-plugin options with Vite-specific configuration.
|
|
5
|
+
*/
|
|
6
|
+
export interface PluginOptions extends BabelPluginOptions {
|
|
7
|
+
/**
|
|
8
|
+
* Converts your source code into a Compiled component.
|
|
9
|
+
* Defaults to `true`.
|
|
10
|
+
*/
|
|
11
|
+
bake?: boolean;
|
|
12
|
+
/**
|
|
13
|
+
* Extracts to CSS when `true`.
|
|
14
|
+
* Defaults to `false`.
|
|
15
|
+
*/
|
|
16
|
+
extract?: boolean;
|
|
17
|
+
/**
|
|
18
|
+
* List of transformer babel plugins to be applied to evaluated files
|
|
19
|
+
*
|
|
20
|
+
* See the [babel docs](https://babeljs.io/docs/en/plugins/#transform-plugins)
|
|
21
|
+
*/
|
|
22
|
+
transformerBabelPlugins?: PluginItem[];
|
|
23
|
+
/**
|
|
24
|
+
* Build in a node environment.
|
|
25
|
+
* Defaults to `false`.
|
|
26
|
+
*/
|
|
27
|
+
ssr?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* When set, extract styles to an external CSS file.
|
|
30
|
+
*/
|
|
31
|
+
extractStylesToDirectory?: {
|
|
32
|
+
source: string;
|
|
33
|
+
dest: string;
|
|
34
|
+
};
|
|
35
|
+
/**
|
|
36
|
+
* Whether to sort shorthand and longhand properties,
|
|
37
|
+
* eg. `margin` before `margin-top` for enforced determinism.
|
|
38
|
+
* Defaults to `true`.
|
|
39
|
+
*/
|
|
40
|
+
sortShorthand?: boolean;
|
|
41
|
+
}
|
package/dist/types.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}
|
package/dist/utils.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Resolver } from '@compiled/babel-plugin';
|
|
2
|
+
import type { PluginOptions } from './types';
|
|
3
|
+
/**
|
|
4
|
+
* Creates a default resolver using enhanced-resolve.
|
|
5
|
+
* This is the same resolver used by webpack and other bundlers,
|
|
6
|
+
* providing robust module resolution with caching.
|
|
7
|
+
*
|
|
8
|
+
* @param config - Vite plugin configuration
|
|
9
|
+
* @returns Resolver compatible with @compiled/babel-plugin
|
|
10
|
+
*/
|
|
11
|
+
export declare function createDefaultResolver(config: PluginOptions): Resolver;
|
package/dist/utils.js
ADDED
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
exports.createDefaultResolver = void 0;
|
|
27
|
+
const fs = __importStar(require("fs"));
|
|
28
|
+
const path_1 = require("path");
|
|
29
|
+
// eslint-disable-next-line @typescript-eslint/no-var-requires
|
|
30
|
+
const enhancedResolve = require('enhanced-resolve');
|
|
31
|
+
// Handle both ESM and CJS imports
|
|
32
|
+
const { CachedInputFileSystem, ResolverFactory } = enhancedResolve.CachedInputFileSystem
|
|
33
|
+
? enhancedResolve
|
|
34
|
+
: enhancedResolve.default || enhancedResolve;
|
|
35
|
+
/**
|
|
36
|
+
* Creates a default resolver using enhanced-resolve.
|
|
37
|
+
* This is the same resolver used by webpack and other bundlers,
|
|
38
|
+
* providing robust module resolution with caching.
|
|
39
|
+
*
|
|
40
|
+
* @param config - Vite plugin configuration
|
|
41
|
+
* @returns Resolver compatible with @compiled/babel-plugin
|
|
42
|
+
*/
|
|
43
|
+
function createDefaultResolver(config) {
|
|
44
|
+
const resolver = ResolverFactory.createResolver(Object.assign(Object.assign({ fileSystem: new CachedInputFileSystem(fs, 4000) }, (config.extensions && {
|
|
45
|
+
extensions: config.extensions,
|
|
46
|
+
})), {
|
|
47
|
+
// This makes the resolver invoke the callback synchronously
|
|
48
|
+
useSyncFileSystemCalls: true }));
|
|
49
|
+
return {
|
|
50
|
+
// The resolver needs to be synchronous, as babel plugins must be synchronous
|
|
51
|
+
resolveSync(context, request) {
|
|
52
|
+
return resolver.resolveSync({}, (0, path_1.dirname)(context), request);
|
|
53
|
+
},
|
|
54
|
+
};
|
|
55
|
+
}
|
|
56
|
+
exports.createDefaultResolver = createDefaultResolver;
|
|
57
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,uCAAyB;AACzB,+BAA+B;AAM/B,8DAA8D;AAC9D,MAAM,eAAe,GAAG,OAAO,CAAC,kBAAkB,CAAC,CAAC;AAEpD,kCAAkC;AAClC,MAAM,EAAE,qBAAqB,EAAE,eAAe,EAAE,GAAG,eAAe,CAAC,qBAAqB;IACtF,CAAC,CAAC,eAAe;IACjB,CAAC,CAAC,eAAe,CAAC,OAAO,IAAI,eAAe,CAAC;AAE/C;;;;;;;GAOG;AACH,SAAgB,qBAAqB,CAAC,MAAqB;IACzD,MAAM,QAAQ,GAAG,eAAe,CAAC,cAAc,+BAC7C,UAAU,EAAE,IAAI,qBAAqB,CAAC,EAAE,EAAE,IAAI,CAAC,IAC5C,CAAC,MAAM,CAAC,UAAU,IAAI;QACvB,UAAU,EAAE,MAAM,CAAC,UAAU;KAC9B,CAAC;QACF,4DAA4D;QAC5D,sBAAsB,EAAE,IAAI,IAC5B,CAAC;IAEH,OAAO;QACL,6EAA6E;QAC7E,WAAW,CAAC,OAAe,EAAE,OAAe;YAC1C,OAAO,QAAQ,CAAC,WAAW,CAAC,EAAE,EAAE,IAAA,cAAO,EAAC,OAAO,CAAC,EAAE,OAAO,CAAW,CAAC;QACvE,CAAC;KACF,CAAC;AACJ,CAAC;AAhBD,sDAgBC"}
|
package/package.json
ADDED
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@compiled/vite-plugin",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "A familiar and performant compile time CSS-in-JS library for React - Vite plugin.",
|
|
5
|
+
"homepage": "https://compiledcssinjs.com/docs/pkg-vite-plugin",
|
|
6
|
+
"bugs": "https://github.com/atlassian-labs/compiled/issues/new?assignees=&labels=bug&template=bug_report.md",
|
|
7
|
+
"repository": {
|
|
8
|
+
"type": "git",
|
|
9
|
+
"url": "https://github.com/atlassian-labs/compiled.git",
|
|
10
|
+
"directory": "packages/vite-plugin"
|
|
11
|
+
},
|
|
12
|
+
"license": "Apache-2.0",
|
|
13
|
+
"author": "Michael Dougall",
|
|
14
|
+
"sideEffects": false,
|
|
15
|
+
"exports": {
|
|
16
|
+
".": {
|
|
17
|
+
"types": "./dist/index.d.ts",
|
|
18
|
+
"import": "./dist/index.js",
|
|
19
|
+
"require": "./dist/index.js",
|
|
20
|
+
"default": "./dist/index.js"
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"main": "./dist/index.js",
|
|
24
|
+
"module": "./dist/index.js",
|
|
25
|
+
"types": "./dist/index.d.ts",
|
|
26
|
+
"files": [
|
|
27
|
+
"dist",
|
|
28
|
+
"src"
|
|
29
|
+
],
|
|
30
|
+
"dependencies": {
|
|
31
|
+
"@babel/core": "^7.26.10",
|
|
32
|
+
"@babel/parser": "^7.26.10",
|
|
33
|
+
"@compiled/babel-plugin": "^0.38.0",
|
|
34
|
+
"@compiled/babel-plugin-strip-runtime": "^0.38.0",
|
|
35
|
+
"@compiled/css": "^0.21.0",
|
|
36
|
+
"@compiled/utils": "^0.13.1",
|
|
37
|
+
"enhanced-resolve": "^5.18.1"
|
|
38
|
+
},
|
|
39
|
+
"devDependencies": {
|
|
40
|
+
"@compiled/react": "^0.18.0",
|
|
41
|
+
"@types/babel__core": "^7.20.3",
|
|
42
|
+
"react": "^17.0.2",
|
|
43
|
+
"vite": "^5.0.0"
|
|
44
|
+
},
|
|
45
|
+
"peerDependencies": {
|
|
46
|
+
"vite": ">= 4.0.0"
|
|
47
|
+
}
|
|
48
|
+
}
|