mm
This commit is contained in:
7
templates/vite-react-lib/playground/App.tsx
Normal file
7
templates/vite-react-lib/playground/App.tsx
Normal file
@@ -0,0 +1,7 @@
|
||||
|
||||
|
||||
function App() {
|
||||
return <div></div>;
|
||||
}
|
||||
|
||||
export default App;
|
||||
12
templates/vite-react-lib/playground/index.html
Normal file
12
templates/vite-react-lib/playground/index.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>vite-project</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
9
templates/vite-react-lib/playground/main.tsx
Normal file
9
templates/vite-react-lib/playground/main.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { StrictMode } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
import App from './App.tsx'
|
||||
|
||||
createRoot(document.getElementById('root')!).render(
|
||||
<StrictMode>
|
||||
<App />
|
||||
</StrictMode>,
|
||||
)
|
||||
@@ -16,11 +16,6 @@
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
|
||||
/* Linting */
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"erasableSyntaxOnly": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": ["src", "scripts", "vite.config.ts"]
|
||||
}
|
||||
|
||||
@@ -2,38 +2,40 @@ import { defineConfig } from "vite";
|
||||
import react from "@vitejs/plugin-react";
|
||||
import path from "path";
|
||||
|
||||
export default defineConfig({
|
||||
// d.ts 由 tsc 完成,使用专门配置 tsconfig.build.json
|
||||
// 转换由 oxc 完成
|
||||
// 打包由 rolldown 完成
|
||||
plugins: [react()],
|
||||
export default defineConfig(({ command }) => {
|
||||
if (command === "serve") {
|
||||
return {
|
||||
plugins: [react()],
|
||||
root: "playground",
|
||||
};
|
||||
}
|
||||
|
||||
build: {
|
||||
cssMinify: false,
|
||||
lib: {
|
||||
entry: path.resolve(import.meta.dirname, "src/index.ts"),
|
||||
// 不写 vite 默认是 index.mjs 和 index.js,不方便识别
|
||||
formats: ["es", "cjs"],
|
||||
// package.json 管别人怎么使用,
|
||||
// build.lib 管怎么打包,生成什么
|
||||
// 如果不一致,就会报错,指向文件不存在
|
||||
fileName: (format) => `index.${format}.js`,
|
||||
},
|
||||
rolldownOptions: {
|
||||
// 避免这些被打包,peerDependencies 对 rolldown 是无效的,不会自动 external
|
||||
external: ["react", "react-dom", "react/jsx-runtime"],
|
||||
// 专门给 UMD / IIFE 的映射表
|
||||
output: {
|
||||
globals: {
|
||||
react: "React",
|
||||
"react-dom": "ReactDOM",
|
||||
return {
|
||||
plugins: [react()],
|
||||
|
||||
build: {
|
||||
cssMinify: false,
|
||||
|
||||
lib: {
|
||||
entry: path.resolve(import.meta.dirname, "src/index.ts"),
|
||||
formats: ["es", "cjs"],
|
||||
fileName: (format) => `index.${format}.js`,
|
||||
},
|
||||
|
||||
rolldownOptions: {
|
||||
external: ["react", "react-dom", "react/jsx-runtime"],
|
||||
output: {
|
||||
globals: {
|
||||
react: "React",
|
||||
"react-dom": "ReactDOM",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
emptyOutDir: true, // 防止旧产物残留
|
||||
sourcemap: true, // 方便调试
|
||||
cssCodeSplit: false, // 合并成一个css文件
|
||||
outDir: "dist", // 专管打包输出目录,tsconfig.build.json 中的 outDir 管的是 d.ts 输出目录
|
||||
},
|
||||
emptyOutDir: true,
|
||||
sourcemap: true,
|
||||
cssCodeSplit: false,
|
||||
outDir: "dist",
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user