sheet.js 셀 스타일 및 병합(merge) 방법

 

sheet.js 셀 스타일 및 셀 병합

---

sheet.js 말고 excel.js 라이브러리를 사용한다면 셀 스타일과 병합하는 과정이 간단합니다. 그리고 github에 사용 방법도 자세히 나와있는 편이라 쉽게 찾아보며 엑셀 기능을 구현할 수 있습니다. 하지만 sheet.js를 사용해야 한다면 그 것은 IE 때문이지 않을까 생각됩니다. 바로 저 처럼 말이죠..

 

 

sheet.js 브라우저 호완성

---

sheet.js 브라우저 호완성 표

 

위 이미지는 sheet.js의 브라우저 호완성 표입니다. 정말이지 끈질긴 IE녀석...

 

 

GitHub - exceljs/exceljs: Excel Workbook Manager

 

 

excelExportIE

---

import * as XLSX from 'xlsx/xlsx.mjs'

// 파라미터 형식
// const columns = [
//     {
//       '번호': '1',
//       '가격': '3000',
//       '코드': '000000',
//       '샘플명': '꿀호떡',
//       '납품시작일': 'YYYY-MM-DD',
//       '납품종료일': 'YYYY-MM-DD'
//     }
//  ]

// const wscols = [ // 각 컬럼의 width 설정 값
//     { wch: 12 },
//     { wch: 12 },
//     { wch: 12 },
//     { wch: 20 },
//     { wch: 15 },
//     { wch: 15 }
//   ]

// const merge = [ { s: { c: 0, r: 0 }, e: { c: 1, r: 1 } }, ... ]

// const fileName = '샘플목록.xlsx' // 확장자 포함

function excelExportIE(columns, colsWidths = null, merge = null, fileName) {
  const wb = XLSX.utils.book_new()
  const ws = XLSX.utils.json_to_sheet(columns, { type: 'binary', cellDates: true, dateNF: 'YYYY-MM-DD' }) // JSON to Sheet
  if (colsWidths !== null) ws['!cols'] = colsWidths // 컬럼 width 설정
  if (merge !== null) ws['!merges'] = merge
  XLSX.utils.book_append_sheet(wb, ws, 'sheet1') // 시트 생성
  XLSX.writeFile(wb, fileName) // xlsx 다운로드
}

export default excelExportIE

 

excelExportIE.js 라는 파일을 만들고 안에 함수 하나 만들었습니다. 각 매개변수로 데이터, 셀 width값, 셀 merge값, 파일 명 이렇게 4개를 받습니다.

 

width랑 merge는 선택사항이며 데이터와 파일명만 제대로 넘겨준다면 엑셀 데이터는 제대로 출력됩니다. widthd의 경우 A1, B1, C1.. 순으로 설정해주면 알아서 늘어나지만 merge의 경우 객체 배열의 형태로 s와 e가 있는데, start와 end의 약자입니다. A1:B1 셀을 병합할 경우 [{s: {c: 0, r:0}, e: { c:1, r:0 } }] 이런 형태로 배열에 추가해줘야합니다.(노가다입니다..)

 

셀 스타일의 경우 아직 구현해본적은 없지만.. 앞으로 구현할 일이 없었으면 합니다. xlsx-style 이라는 라이브러리가 또 있던데.. 제발 설치하는 일이 없겠죠? ㅎㅎ

 

 

SheetJS Community Edition | SheetJS Community Edition