mirror of
https://github.com/ershisan99/lib-live-03-07.git
synced 2025-12-16 12:33:30 +00:00
bundler setup
This commit is contained in:
18
.eslintrc.cjs
Normal file
18
.eslintrc.cjs
Normal file
@@ -0,0 +1,18 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: { browser: true, es2020: true },
|
||||
extends: [
|
||||
'eslint:recommended',
|
||||
'plugin:@typescript-eslint/recommended',
|
||||
'plugin:react-hooks/recommended',
|
||||
],
|
||||
ignorePatterns: ['dist', '.eslintrc.cjs'],
|
||||
parser: '@typescript-eslint/parser',
|
||||
plugins: ['react-refresh'],
|
||||
rules: {
|
||||
'react-refresh/only-export-components': [
|
||||
'warn',
|
||||
{ allowConstantExport: true },
|
||||
],
|
||||
},
|
||||
}
|
||||
24
.gitignore
vendored
Normal file
24
.gitignore
vendored
Normal file
@@ -0,0 +1,24 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
30
README.md
Normal file
30
README.md
Normal file
@@ -0,0 +1,30 @@
|
||||
# React + TypeScript + Vite
|
||||
|
||||
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
|
||||
|
||||
Currently, two official plugins are available:
|
||||
|
||||
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
|
||||
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
|
||||
|
||||
## Expanding the ESLint configuration
|
||||
|
||||
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
|
||||
|
||||
- Configure the top-level `parserOptions` property like this:
|
||||
|
||||
```js
|
||||
export default {
|
||||
// other rules...
|
||||
parserOptions: {
|
||||
ecmaVersion: 'latest',
|
||||
sourceType: 'module',
|
||||
project: ['./tsconfig.json', './tsconfig.node.json', './tsconfig.app.json'],
|
||||
tsconfigRootDir: __dirname,
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
|
||||
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
|
||||
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
|
||||
13
index.html
Normal file
13
index.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Vite + React + TS</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
31
package.json
Normal file
31
package.json
Normal file
@@ -0,0 +1,31 @@
|
||||
{
|
||||
"name": "lib",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc -b && vite build",
|
||||
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^22.1.0",
|
||||
"@types/react": "^18.3.3",
|
||||
"@types/react-dom": "^18.3.0",
|
||||
"@typescript-eslint/eslint-plugin": "^7.15.0",
|
||||
"@typescript-eslint/parser": "^7.15.0",
|
||||
"@vitejs/plugin-react-swc": "^3.5.0",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-plugin-react-hooks": "^4.6.2",
|
||||
"eslint-plugin-react-refresh": "^0.4.7",
|
||||
"prettier": "^3.3.3",
|
||||
"typescript": "5.4.2",
|
||||
"vite": "^5.3.4",
|
||||
"vite-plugin-dts": "4.0.0-beta.2"
|
||||
}
|
||||
}
|
||||
2422
pnpm-lock.yaml
generated
Normal file
2422
pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load Diff
7
src/components/button.tsx
Normal file
7
src/components/button.tsx
Normal file
@@ -0,0 +1,7 @@
|
||||
import { ComponentPropsWithoutRef } from "react";
|
||||
|
||||
type Props = ComponentPropsWithoutRef<"button">;
|
||||
|
||||
export function Button(props: Props) {
|
||||
return <button {...props}>Hello World</button>;
|
||||
}
|
||||
1
src/components/index.ts
Normal file
1
src/components/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export * from "./button";
|
||||
1
src/index.ts
Normal file
1
src/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export * from "./components";
|
||||
1
src/vite-env.d.ts
vendored
Normal file
1
src/vite-env.d.ts
vendored
Normal file
@@ -0,0 +1 @@
|
||||
/// <reference types="vite/client" />
|
||||
72
tsconfig.json
Normal file
72
tsconfig.json
Normal file
@@ -0,0 +1,72 @@
|
||||
{
|
||||
"extends": [],
|
||||
"compilerOptions": {
|
||||
// This is a component library, so "ESNext" is a good choice. Also it requires very little down-leveling during transpilation.
|
||||
"target": "ESNext",
|
||||
|
||||
// Include a list of type definitions for build-in JS APIs.
|
||||
"lib": ["DOM", "DOM.Iterable", "ESNext"],
|
||||
|
||||
// Specify the module system for the output files. It's not required for Vite but good to have.
|
||||
"module": "ESNext",
|
||||
|
||||
// The types defined in "vite/client" are included in global scope.
|
||||
"types": ["vite/client"],
|
||||
|
||||
// Do not emit compiled output files, vite will take care of the that.
|
||||
"noEmit": true,
|
||||
|
||||
// Vite will handle the resolution of the import paths.
|
||||
"moduleResolution": "Bundler",
|
||||
|
||||
// Use the React 17 JSX transform, importing React is no longer required.
|
||||
"jsx": "react-jsx",
|
||||
|
||||
// Skip the type checking for declaration files to improve performance.
|
||||
"skipLibCheck": true,
|
||||
|
||||
// Allow importing modules with ".json" extension.
|
||||
"resolveJsonModule": true,
|
||||
|
||||
// "declarationMap" need to be enabled to let Vite generates source map files.
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
|
||||
// Importing .js files is not allowed, enable if needed.
|
||||
"allowJs": false,
|
||||
|
||||
// Fix the mis-match of behaviors between ES import and CommonJS require.
|
||||
"esModuleInterop": true,
|
||||
|
||||
// Allow default import from modules with no default export, i.e. you can write `import React from 'react'` instead of `import * as React from 'react'`.
|
||||
"allowSyntheticDefaultImports": true,
|
||||
|
||||
// Enforce the file name casing to be consistent with development environment.
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
|
||||
// Ensure the run-time code does not depend on the TypeScript-only features, such as constant enum.
|
||||
"isolatedModules": true,
|
||||
|
||||
// Allow importing TypeScript modules.
|
||||
"allowImportingTsExtensions": true,
|
||||
|
||||
// Enfore "type" modifier for type imports.
|
||||
"verbatimModuleSyntax": false,
|
||||
|
||||
// Ensure the public class field initialization is transpiled correctly to match the future JS standard.
|
||||
"useDefineForClassFields": true,
|
||||
|
||||
// Type-checking options
|
||||
"strict": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"noImplicitOverride": true,
|
||||
"noImplicitReturns": true,
|
||||
"noImplicitThis": true,
|
||||
"noPropertyAccessFromIndexSignature": false,
|
||||
"noUncheckedIndexedAccess": true,
|
||||
"noUnusedLocals": false,
|
||||
"noUnusedParameters": true
|
||||
},
|
||||
"include": ["./src/**/*.ts", "./src/**/*.tsx"],
|
||||
"exclude": ["./src/**/*.stories.*"]
|
||||
}
|
||||
39
vite.config.ts
Normal file
39
vite.config.ts
Normal file
@@ -0,0 +1,39 @@
|
||||
import react from "@vitejs/plugin-react-swc";
|
||||
import { resolve, join } from "path";
|
||||
import { defineConfig } from "vite";
|
||||
import dts from "vite-plugin-dts";
|
||||
|
||||
import { dependencies, devDependencies } from "./package.json";
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react(), dts({ rollupTypes: true })],
|
||||
build: {
|
||||
target: "esnext",
|
||||
minify: false,
|
||||
lib: {
|
||||
entry: resolve(__dirname, join("src", "index.ts")),
|
||||
fileName: "index",
|
||||
formats: ["es", "cjs"],
|
||||
name: "internship-lib",
|
||||
},
|
||||
rollupOptions: {
|
||||
// make sure to externalize deps that shouldn't be bundled
|
||||
// into your library
|
||||
external: [
|
||||
...Object.keys(devDependencies),
|
||||
...Object.keys(dependencies),
|
||||
"react/jsx-runtime",
|
||||
],
|
||||
output: {
|
||||
// Provide global variables to use in the UMD build
|
||||
// for externalized deps
|
||||
globals: {
|
||||
react: "React",
|
||||
},
|
||||
dir: "dist",
|
||||
entryFileNames: "[name].js",
|
||||
format: "es",
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user