vite-plugin-twstyled
Version:
Vite plugin for twstyled -- the full-featured Tailwind CSS + CSS in JS Compiler
146 lines (145 loc) • 6.41 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
/* eslint-disable @rushstack/security/no-unsafe-regexp */
const babel = __importStar(require("@babel/core"));
const pluginutils_1 = require("@rollup/pluginutils");
const babel_preflight_check_1 = __importDefault(require("./babel-preflight-check"));
const BUNDLED = 'bundled';
function RollupPluginFactory(pluginOptions) {
let filter;
const _a = Object.assign(Object.assign({ extensions: babel.DEFAULT_EXTENSIONS, plugins: [], sourceMaps: true }, pluginOptions), { presets: [], skipPreflightCheck: false, babelHelpers: pluginOptions.babelHelpers || BUNDLED, caller: Object.assign({ name: 'rollup-plugin-twstyled', supportsStaticESM: true, supportsDynamicImport: true, supportsTopLevelAwait: true, supportsExportNamespaceFrom: false }, pluginOptions.caller) }), { exclude, extensions, babelHelpers, include, filter: customFilter, skipPreflightCheck } = _a, babelOptions = __rest(_a, ["exclude", "extensions", "babelHelpers", "include", "filter", "skipPreflightCheck"]);
const preset = pluginOptions.presets[0];
const { plugins } = preset({ caller: () => babelOptions.caller }, {
outputPath: './src/index.twstyled.css',
extension: '.twstyled.css'
});
babelOptions.plugins = [
[
'@babel/plugin-transform-react-jsx',
{
runtime: 'automatic'
}
],
[
'@babel/plugin-transform-typescript',
{
allowNamespaces: true,
isTSX: true
}
]
].concat(plugins);
delete pluginOptions.presets;
const babelConfig = babel.loadPartialConfig(babelOptions);
const plugin = {
name: 'babel',
options() {
const extensionRegExp = new RegExp(`(${extensions.map(escapeRegExpCharacters).join('|')})$`);
if (customFilter && (include || exclude)) {
console.error('Could not handle include or exclude with custom filter together');
throw new Error('Could not handle include or exclude with custom filter together');
}
const userDefinedFilter = typeof customFilter === 'function'
? customFilter
: pluginutils_1.createFilter(include, exclude);
filter = (id) => extensionRegExp.test(stripQuery(id).bareId) && userDefinedFilter(id);
return null;
},
resolveId(id) {
return null;
},
load(id) {
return null;
},
transform(code, filename) {
if (!filter(filename))
return { code };
return transformCode(code, filename, babelConfig, (transformOptions) => __awaiter(this, void 0, void 0, function* () {
if (!skipPreflightCheck) {
yield babel_preflight_check_1.default(this, babelHelpers, transformOptions);
}
return transformOptions;
}));
}
};
return plugin;
}
exports.default = RollupPluginFactory;
//
// MAIN CODE TRANSFORM
//
function transformCode(inputCode, filename, babelConfig, finalizeOptions) {
return __awaiter(this, void 0, void 0, function* () {
// file is ignored by babel
if (!babelConfig) {
return null;
}
let transformOptions = babelConfig.options;
transformOptions.filename = filename;
if (finalizeOptions) {
transformOptions = yield finalizeOptions(transformOptions);
}
const result = yield babel.transformAsync(inputCode, Object.assign(Object.assign({}, transformOptions), { filename, sourceMaps: true, sourceFileName: filename }));
const { code, map } = result;
return {
code,
map
};
});
}
//
// UTILITY FUNCTIONS
//
const regExpCharactersRegExp = /[\\^$.*+?()[\]{}|]/g;
const escapeRegExpCharacters = (str) => str.replace(regExpCharactersRegExp, '\\$&');
function stripQuery(id) {
// strip query params from import
const [bareId, query] = id.split('?');
const suffix = `${query ? `?${query}` : ''}`;
return {
bareId,
query,
suffix
};
}