Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

스타일 가이드 - 베이스 컴포넌트 이름 #25

Open
Bogyie opened this issue Nov 9, 2022 · 1 comment
Open

스타일 가이드 - 베이스 컴포넌트 이름 #25

Bogyie opened this issue Nov 9, 2022 · 1 comment
Assignees

Comments

@Bogyie
Copy link
Member

Bogyie commented Nov 9, 2022

  • Deleted paragraph compare to https://v2.vuejs.org/v2/style-guide/

    - Since these components are so frequently used, you may want to simply make them global instead of importing them everywhere. A prefix makes this possible with Webpack:
    ``` js
    var requireComponent = require.context("./src", true, /^Base[A-Z]/)
    requireComponent.keys().forEach(function (fileName) {
    var baseComponentConfig = requireComponent(fileName)
    baseComponentConfig = baseComponentConfig.default || baseComponentConfig
    var baseComponentName = baseComponentConfig.name || (
    fileName
    .replace(/^.+\//, '')
    .replace(/\.\w+$/, '')
    )
    Vue.component(baseComponentName, baseComponentConfig)
    })
    ```

  • 스타일 가이드 - 베이스 컴포넌트 이름 [문단 삭제] #51 Not translated

    ### 베이스 컴포넌트 이름 <sup data-p="b">매우 추천함</sup>
    **Base components (a.k.a. presentational, dumb, or pure components) that apply app-specific styling and conventions should all begin with a specific prefix, such as `Base`, `App`, or `V`.**
    {% raw %}
    <details>
    <summary>
    <h4>자세한 설명</h4>
    </summary>
    {% endraw %}
    These components lay the foundation for consistent styling and behavior in your application. They may **only** contain:
    - HTML elements,
    - other base components, and
    - 3rd-party UI components.
    But they'll **never** contain global state (e.g. from a Vuex store).
    Their names often include the name of an element they wrap (e.g. `BaseButton`, `BaseTable`), unless no element exists for their specific purpose (e.g. `BaseIcon`). If you build similar components for a more specific context, they will almost always consume these components (e.g. `BaseButton` may be used in `ButtonSubmit`).
    Some advantages of this convention:
    - When organized alphabetically in editors, your app's base components are all listed together, making them easier to identify.
    - Since component names should always be multi-word, this convention prevents you from having to choose an arbitrary prefix for simple component wrappers (e.g. `MyButton`, `VueButton`).
    - Since these components are so frequently used, you may want to simply make them global instead of importing them everywhere. A prefix makes this possible with Webpack:

@Mccreate
Copy link
Collaborator

I tried to translate this. 👀

Mccreate pushed a commit to Mccreate/kr.vuejs.org that referenced this issue Nov 14, 2022
@Mccreate Mccreate linked a pull request Nov 14, 2022 that will close this issue
2 tasks
Mccreate added a commit that referenced this issue Nov 16, 2022
스타일 가이드 - 베이스 컴포넌트 이름 #25 - (draft 상태로 처리)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants