0.1.25 • Published 10 months ago

@lawform/autodoc v0.1.25

Weekly downloads
-
License
-
Repository
-
Last release
10 months ago

lawform_autodoc docs

배포시 주의사항!

  • submodule이 아닌 module만 따로 clone해서 빌드 & export된 코드 host에서 구동 후 deploy.

setting

0. submodule 추가

1. host next의 eslintrc.json & tsconfig.json & tailwind.config.js 설정 추가.

// eslintrc.json
{
    // ...
    // module은 host의 lint에 영향을 받지 않도록 autodoc module의 path 추가.
    "ignorePatterns": [..., "lib/autodoc"],
    // ...
}

// tailwind.config.js
{
    // ...
    content: [
        // ...
        '../../node_modules/@lawform/autodoc/**/*.{js,jsx,ts,tsx}',
    ]
    // ...
}

2. root file에 next(_app.tsx), react(App.tsx) tinymce css 적용.

import '@lawform/autodoc/dist/styles/TinymceEditor.scss'

3. root file에 provider 적용.

// _app.tsx
<>
    <AutodocProvider>
        ...
        <Component {...pageProps} />
        <LawLHashSwitchRouterManager />
        ...
    </AutodocProvider>
</>

4. cfs, bindData init

  • cfs, bindData를 load | update 하는 로직에서 useBindData의 useCfsState, useBindDataState를 통해 cfs, bindData를 set
const { useBindDataState, useCfsState } = useBindData()
const [cfs, setCfs] = useCfsState()
const [bindData, setBindData] = useBindDataState()

useEffect(() => {
    ...
    setCfs(cfs);
    setBindDta(bindData);
}, [...])

usage

  • props type, callback 설명등은 jsDoc 참고.

InputSection

<InputSection
    className={!showMobileInput ? 'hidden' : ''}
    lastBindData={lastBindData}
    setLastBindData={setLastBindData}
    socketCallBackData={socketCallBackData}
/>

OutputSection

  • useRenderHtml을 통해 renderHtml string 추출 후 props로 전달.
  • generateCallback: mobile 화면에서 노출되는 문서의 pdf download fetch callback.
// 1. renderHtml 추출
const { renderHtml } = useRenderHtml({
    cfs,
    bindData,
    lastBindData,
    socketCallBackData,
    htmlData,
})

return (
    ...
    // 2. renderHtml, participants, generateCallback props로 전달.
    <OutputSection
        participants={participants?.map((user) => user.user_name) ?? []}
        renderHtml={renderHtml}
        generateCallback={generateThirdpartyPdfFromHtml}
    />
    ...
)

CustomEditor

  • tinymce dynamic import를 위해 autodoc_branch가 아닌 사용하는 file에서 직접 dynamic import
const CustomEditor = dynamic(
    () =>
        process.env.NODE_ENV === 'development'
            ? import('@/lib/autodoc/src/lib/components/CustomEditor') // submodule 설치 path
            : import('@lawform/autodoc/dist/components/CustomEditor'),
    {
        ssr: false,
    }
)
0.1.25

10 months ago

0.1.24

10 months ago

0.1.20

10 months ago

0.1.21

10 months ago

0.1.19

10 months ago

0.1.10

11 months ago

0.1.11

11 months ago

0.1.12

11 months ago

0.1.13

11 months ago

0.1.14

11 months ago

0.1.15

11 months ago

0.1.16

11 months ago

0.1.17

11 months ago

0.1.18

11 months ago

0.1.9

11 months ago

0.1.8

11 months ago

0.1.7

11 months ago

0.1.5

11 months ago

0.1.4

11 months ago

0.1.3

11 months ago

0.1.2

11 months ago

0.1.1

11 months ago

0.1.0

11 months ago