강의

멘토링

커뮤니티

Cộng đồng Hỏi & Đáp của Inflearn

Hình ảnh hồ sơ của redginn9040
redginn9040

câu hỏi đã được viết

Kiểm tra sách truyện và giao diện người dùng có thể được áp dụng trực tiếp vào thực hành

[Cập nhật] Phân phối design system dưới dạng npm package

index.tsx 빌드 오류

Đã giải quyết

Viết

·

352

·

Đã chỉnh sửa

0

안녕하세요

강의에 사용된 버전이나 pnpm을 사용하는 등 다른게 진행한 부분이 있습니다만 빌드할때 에러가 나는데 이해가 안되는 부분이 있어 질문드립니다.

pakage.json

  "name": "@twosday/ui",
  "description": "Design System for twosday",
  "private": false,
  "publishConfig": {
    "access": "public"
  },
  "files": [
    "dist"
  ],
  "main": "dist/index.umd.js",
  "module": "dist/index.es.js",
  "types": "dist/index.d.ts",
  "exports": {
    ".": {
      "import": "./dist/index.es.js",
      "require": "./dist/index.umd.js",
      "types": "./dist/index.d.ts"
    },
    "./styles": {
      "import": "./dist/styles/index.css"
    }
  },
  "version": "0.0.1",
  "type": "module",
  "license": "MIT",
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
import svgr from "vite-plugin-svgr";
import path from "path";
import dts from "vite-plugin-dts";
import { viteStaticCopy } from "vite-plugin-static-copy";

// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "src"),
    },
  },
  plugins: [
    react(),
    vanillaExtractPlugin({
      identifiers: ({ hash }) => `css_${hash}`,
    }),
    svgr(),
    dts(),
    viteStaticCopy({
      targets: [{ src: "src/index.css", dest: "" }],
    }),
  ],
  build: {
    lib: {
      name: "@twosday/ui",
      entry: path.resolve(__dirname, "src/index.tsx"),
      fileName: (format) => `index.${format}.js`,
    },
    rollupOptions: {
      external: ["react", "react-dom"],
      output: {
        globals: {
          react: "React",
          "react-dom": "ReactDOM",
        },
      },
    },
    sourcemap: true,
    emptyOutDir: true,
  },
});

 

스크린샷 2024-08-04 220152.png

 

grs04@BOOK-NN36R5QM7J MINGW64 ~/Desktop/sideproject/my-story-book (main)
$ pnpm build

> @twosday/ui@0.0.1 build C:\Users\grs04\Desktop\sideproject\my-story-book
> tsc -b && vite build

vite v5.3.5 building for production...
src/index.tsx:1:38 - error TS6142: Module './component/LoginForm' was resolved to 'C:/Users/grs04/Desktop/sideproject/my-story-book/src/component/LoginForm.tsx', but '--jsx' is not set.   

1 export { default as LoginForm } from "./component/LoginForm";
                                       ~~~~~~~~~~~~~~~~~~~~~~~
src/index.tsx:2:35 - error TS6142: Module './component/Button' was resolved to 'C:/Users/grs04/Desktop/sideproject/my-story-book/src/component/Button.tsx', but '--jsx' is not set.

2 export { default as Button } from "./component/Button";
                                    ~~~~~~~~~~~~~~~~~~~~

✓ 15 modules transformed.

[vite:dts] Start generate declaration files...
dist/style.css     0.18 kB │ gzip: 0.15 kB
dist/index.es.js  22.47 kB │ gzip: 6.77 kB │ map: 67.56 kB
[vite:dts] Declaration files built in 589ms.

[vite-plugin-static-copy] Copied 1 items.
dist/style.css      0.18 kB │ gzip: 0.15 kB
dist/index.umd.js  14.88 kB │ gzip: 5.90 kB │ map: 65.89 kB
✓ built in 1.12s

 

vite.config.ts에서 build 에 작성한 부분을 지우고 기본설정으로 하면 잘 되는데 강의처럼 build부분을 작성을 하면 jsx flag를 설정하라고 나오면서 component 폴더에 d.ts 파일들이 생성이 안됩니다.

 

 

reacttypescripttailwind-cssstorybookui-testing

Câu trả lời 2

1

redginn9040님의 프로필 이미지
redginn9040
Người đặt câu hỏi

0

jasonkang님의 프로필 이미지
jasonkang
Người chia sẻ kiến thức

공유 감사합니다! 다른분들도 겪으실 수 있는 문제인 것 같아요~

Hình ảnh hồ sơ của redginn9040
redginn9040

câu hỏi đã được viết

Đặt câu hỏi