πŸ“¦ GitLab Packages (npm) μ‚¬μš© κ°€μ΄λ“œ - sssssubin/common-front GitHub Wiki

1. Personal Access Token 생성

  • GitLabμ—μ„œ Personal Access Token(PAT)을 μƒμ„±ν•©λ‹ˆλ‹€.

2. νŒ¨ν‚€μ§€ ν”„λ‘œμ νŠΈ μ„€μ •

πŸ“¦ package.json μ˜ˆμ‹œ

{
  "name": "@educo/common_front",
  "version": "1.0.0",
  "main": "dist/index.cjs.js",
  "module": "dist/index.es.js",
  "style": "dist/style.css",
  "exports": {
    ".": {
      "import": "./dist/index.es.js",
      "require": "./dist/index.cjs.js",
      "style": "./dist/style.css"
    }
  },
  "type": "module",
  "files": ["dist"],
  "scripts": {
    "build": "vite build",
    "release": "npm run build && npm version patch && npm publish && git push && git push --tags"
  },
  "publishConfig": {
    "registry": "https://devgit.educo.co.kr/api/v4/projects/<ν”„λ‘œμ νŠΈID>/packages/npm/" 
  },
  "repository": {
    "type": "git",
    "url": "https://devgit.educo.co.kr/educo/common_front.git"
  },
  "peerDependencies": {
    "vue": "^3.0.0"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^5.0.0",
    "sass-embedded": "^1.89.0",
    "vite": "^5.0.0",
    "vue": "^3.5.15"
  }
}

πŸ”§ .npmrc μ„€μ • (νŒ¨ν‚€μ§€ 루트)

@educo:registry=https://devgit.educo.co.kr/api/v4/projects/<ν”„λ‘œμ νŠΈID>/packages/npm/
//devgit.educo.co.kr/api/v4/projects/<ν”„λ‘œμ νŠΈID>/packages/npm/:_authToken=glpat-YourPersonalAccessToken

⚠️ ghp_YourPersonalAccessToken 뢀뢄은 μ‹€μ œ ν† ν°μœΌλ‘œ λŒ€μ²΄ν•˜μ„Έμš”.

βš™οΈ vite.config.js μ˜ˆμ‹œ

import { fileURLToPath } from "node:url";
import { dirname, resolve } from "path";
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

export default defineConfig({
  plugins: [vue()],
  build: {
    target: "node18",
    lib: {
      entry: resolve(__dirname, "src/index.js"),
      name: "CommonFront",
      formats: ["es", "cjs"],
      fileName: (format) => `index.${format}.js`,
    },
    rollupOptions: {
      external: ["vue"],
      output: {
        globals: {
          vue: "Vue"
        }
      }
    }
  }
});

πŸ“ index.js μ˜ˆμ‹œ

import BaseComponent from "./components/BaseComponent.vue";
import "./components/BaseComponent.scss";

export { BaseComponent };

3. λ‹€λ₯Έ ν”„λ‘œμ νŠΈμ—μ„œ νŒ¨ν‚€μ§€ μ„€μΉ˜ 및 μ‚¬μš©

πŸ“„ .npmrc μ„€μ • (μ‚¬μš© ν”„λ‘œμ νŠΈ 루트)

@educo:registry=https://devgit.educo.co.kr/api/v4/projects/<ν”„λ‘œμ νŠΈID>/packages/npm/
//devgit.educo.co.kr/api/v4/projects/<ν”„λ‘œμ νŠΈID>/packages/npm/:_authToken=glpat-YourPersonalAccessToken

πŸ“¦ μ„€μΉ˜

npm install @educo/common_front

βš™οΈ vite.config.js μ˜ˆμ‹œ

import { fileURLToPath } from 'node:url'
import { dirname, resolve } from 'node:path'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@common_front': resolve(__dirname, 'node_modules/@educo/common_front/dist'),
    },
  },
  optimizeDeps: {
    include: ['@educo/common_front'],
  },
  server: {
    port: 3000,
  },
})

βœ… μ‚¬μš© μ˜ˆμ‹œ

import { BaseComponent } from '@educo/common_front';
import '@common_front/style.css';
⚠️ **GitHub.com Fallback** ⚠️