feat(react): enable automatic CSS injection for MediaSkinDefault component

- Configure rollup to inject CSS directly into JavaScript bundles instead of extracting to separate files
- Remove CSS export from package.json as styles are now auto-included
- Update react-demo to remove manual CSS import requirement
- Enable seamless component usage: import { MediaSkinDefault } from '@vjs-10/react' now automatically includes styles

This provides the expected developer experience for React component libraries where
importing a component automatically brings its required styles without manual CSS imports.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Christian Pillsbury
2025-08-13 12:28:29 -07:00
co-authored by Claude
parent dce4f5cdaf
commit bc8adaa508
3 changed files with 6 additions and 6 deletions
-1
View File
@@ -1,7 +1,6 @@
import React from 'react';
import ReactDOM from 'react-dom/client';
import { MediaProvider, Video, MediaSkinDefault } from '@vjs-10/react';
import '@vjs-10/react/style.css';
const DemoPlayer = () => {
return (
+1 -2
View File
@@ -10,8 +10,7 @@
"types": "./dist/index.d.ts",
"import": "./dist/index.mjs",
"require": "./dist/index.js"
},
"./style.css": "./dist/index.css"
}
},
"files": [
"dist"
+5 -3
View File
@@ -26,10 +26,10 @@ module.exports = [
commonjs(),
postcss({
modules: true,
extract: 'index.css',
extract: false, // Don't extract CSS to separate file
inject: true, // Inject CSS into JS bundle
minimize: false,
sourceMap: true,
inject: false, // Don't inject CSS, extract it
}),
typescript({
tsconfig: 'tsconfig.json',
@@ -60,8 +60,10 @@ module.exports = [
commonjs(),
postcss({
modules: true,
extract: false, // Don't extract CSS for CJS build to avoid conflicts
extract: false, // Don't extract CSS for CJS build
inject: true, // Inject CSS into JS bundle
minimize: false,
sourceMap: true,
}),
typescript({
tsconfig: 'tsconfig.json',