open-index/open-npm huggingface dataset:
npm package: @musma/eslint-config-react
Description: Musma's ESLint config with React
Author: YoungSu Kim
Latest version: 0.1.16

# @musma/eslint-config

무스마 ESLint Config 입니다. Typescript를 사용하는 모든 프로젝트에서 사용하여 코딩 컨벤션을 유지하도록 합시다.

## 설치방법

1. 루트 디렉토리에 .npmrc 파일을 생성합니다. (주의! 루트 디렉토리입니다. 프로젝트내에서 하는게 아닙니다.)

```
vi ~/.npmrc
```

2. 루트 디렉토리의 .npmrc 파일에 아래의 내용을 넣습니다.
   토큰 발급 방법은 https://musma.github.io/2019/09/30/github-package-registry.html

```
@musma:registry=https://npm.pkg.github.com/
//npm.pkg.github.com/:_authToken={자신의토큰}
```

3. 프로젝트내에 .npmrc 파일 생성 (이미 있다면 패쓰!)

```
vi .npmrc
```

4. 프로젝트내에 .npmrc 파일에 아래 내용 추가

```
@musma:registry=https://npm.pkg.github.com/
```

5. @musma/eslint-config 의존성 설치

```
yarn add -D @musma/eslint-config
```

6. 프로잭트내에 `.eslintrc` 파일 생성(이미 있다면 패쓰!)

```
vi .eslintrc
```

7. 프로젝트내에 `.eslintrc` 파일에 아래의 내용을 추가합니다.

```
{
  "extends": ["@musma"]
}
```

## Lint, Prettier가 작동하지 않을 경우

1. VS Code 에서 `Command + ,` 를 클릭하여 설정 페이지를 연다

![스크린샷 2022-06-30 오후 2 00 12](https://user-images.githubusercontent.com/28969912/176596876-05978501-22cc-4f9a-ba94-27a9c49358c4.png)

2. `사용자` 탭에서 화면 상단의 `JSON 열기` 버튼을 클릭한다.

3. 개인이 사용하는 VS Code Theme 관련 코드를 제외하고 모두 없앤다.

## License

Open source [licensed as MIT](./LICENSE).

- @typescript-eslint/parser : 타입스크립트에서 ESLint를 사용할 수 있게 하는 파서
- @typescript-eslint/eslint-plugin: 코드 베이스에서 ESLint 규칙을 적용하는 플러그인
- eslint-config-prettier: 불필요하거나 Prettier와 충돌할 수 있는 모든 규칙을 비활성화
- eslint-plugin-prettier: 코드 포매팅할 때 Prettier를 사용하게 만드는 규칙 추가
npm package: @musma/eslint-config-vue
Description: Musma's ESLint config with Vue
Author: musma
Latest version: 1.0.1

```

"dependencies": {
    "@eslint/js": "^9.23.0",
    "eslint": "9.17.0",
    "eslint-config-prettier": "^9.1.0",
    "eslint-plugin-html": "^8.1.2",
    "eslint-plugin-import": "^2.31.0",
    "eslint-plugin-prettier": "^5.2.6",
    "eslint-plugin-unused-imports": "^4.1.4",
    "eslint-plugin-vue": "9.32.0",
    "globals": "^16.0.0",
    "prettier": "^3.5.3",
    "prettier-plugin-tailwindcss": "^0.6.11",
    "typescript-eslint": "^8.29.0"
},

```
npm package: @musma/stylelint-config-vue
Description: Musma's ESLint style config with Vue
Author: musma
Latest version: 1.0.0

```

"dependencies": {
    "@eslint/js": "^9.23.0",
    "eslint": "9.17.0",
    "eslint-config-prettier": "^9.1.0",
    "eslint-plugin-html": "^8.1.2",
    "eslint-plugin-import": "^2.31.0",
    "eslint-plugin-prettier": "^5.2.6",
    "eslint-plugin-unused-imports": "^4.1.4",
    "eslint-plugin-vue": "9.32.0",
    "globals": "^16.0.0",
    "prettier": "^3.5.3",
    "prettier-plugin-tailwindcss": "^0.6.11",
    "typescript-eslint": "^8.29.0"
},

```
npm package: @musora/helper-functions
Description: Helper functions for MusoraJS
Author: Curtis Conway
Latest version: 0.1.34

[![Build Status](https://travis-ci.com/railroadmedia/js-helper-functions.png?branch=master)](https://travis-ci.com/railroadmedia/js-helper-functions)

# js-helper-functions
Javascript helper functions for use in Vuesora and Musora Center
npm package: @musora/icons
Description: A custom svg icon font/library
Author: Curtis Conway
Latest version: 1.0.6

# Icons - @musora/icons
A custom svg icon font/library

[![Build Status](https://travis-ci.com/railroadmedia/icons.png?branch=master)](https://travis-ci.com/railroadmedia/icons)

## Usage

#### Loading From a CDN

```html
<head>
    <link 
        rel="stylesheet" 
        href="https://d1prhhmg8i11jr.cloudfront.net/v1.0.0/dist/icons.css"
    >
</head>
<body>
    <i class="icon-courses"></i>
</body>
```

<hr>

#### Loading from NPM

`npm install @musora/icons`
or
`yarn install @musora/icons`

Using a Javascript file:
```javascript
import '@musora/icons/dist/icons.css';
```

Using a CSS file:
```css
@import '~@musora/icons/dist/icons.css';
```

Keep in mind that your webpack config will need to have the relevant file loaders.
Webpack should give you warnings/errors regarding the loaders you need.

<hr>

#### Using the SVGs in React Native

1. Install the package from NPM or Yarn `npm install @musora/icons` or `yarn install @musora/icons`
2. Install the [react-native-svg](https://github.com/react-native-community/react-native-svg) package
3. Install the [react-native-svg-transformer](https://github.com/kristerkari/react-native-svg-transformer) package
4. In your `metro.config.js` file, add the following transformer:
```javascript
const { getDefaultConfig } = require('metro-config');

module.exports = (async () => {
  const {
    resolver: { sourceExts, assetExts },
  } = await getDefaultConfig();
  return {
    transformer: {
      babelTransformerPath: require.resolve('react-native-svg-transformer'),
    },
    resolver: {
      assetExts: assetExts.filter(ext => ext !== 'svg'),
      sourceExts: [...sourceExts, 'svg'],
    },
  };
})();
```

You can now import the SVG file directly and use it as a component:
```jsx harmony
import CourseIcon from '@musora/icons/assets/svg/courses.svg';

<CourseIcon width={100} height={100} />
```

## Adding New Icons

1. Make sure your svg is a 100x100 square and place it in the assets/svg directory
2. Install the dependencies - `yarn install`
3. Generate the Font - `yarn font:generate`

## Deployment to S3

1. `npm version patch` - This command will do a few things:
    - Bump the version number up by 1: `1.0.0 -> 1.0.1`
    - Create a commit and tag under that version number
2. Push the commit **and the tag**

_Note that Travis **will only deploy to S3 when you push the tag**._
- The directory it deploys to will match the version number in the tag
npm package: @musora/models
Description: Data models for all Musora back-end services
Author: Curtis
Latest version: 0.1.3

# js-models - @musora/models
Data models for all Musora back-end services

[![Build Status](https://travis-ci.com/railroadmedia/js-models.png?branch=master)](https://travis-ci.com/railroadmedia/js-models)
[![Coverage Status](https://coveralls.io/repos/github/railroadmedia/js-models/badge.svg?branch=master)](https://coveralls.io/github/railroadmedia/js-models?branch=master)

## Installation

### Yarn
`yard add @musora/models`

### NPM
`npm install @musora/models --save`

## Usage

### ContentModel

#### Accessing Data
```javascript
import { ContentModel } from '@musora/models';

const content = new ContentModel(post);

const contentTitle = content.getField('title');
```

#### Extending Models for Data Binding
```javascript
import { ContentModel } from '@musora/models';

export class Song extends ContentModel {
    constructor(){
        super();
    
        this.cardTitle = this.getField('title');
        this.cardDescription = this.getData('description');
    }
}
```

##### React
```jsx harmony
<ContentCard 
    title={song.cardTitle}
    description={song.cardDescription}
/>
```

##### Vue
```vue
<ContentCard 
    :title="song.cardTitle"
    :description="song.cardDescription"
/>
```
npm package: @musora/services
Description: HTTP request modules for all Musora back-end services
Author: Curtis Conway
Latest version: 0.1.4

# js-services - @musora/services
HTTP request modules for all Musora back-end services

[![Build Status](https://travis-ci.com/railroadmedia/js-services.png?branch=master)](https://travis-ci.com/railroadmedia/js-services)
[![Coverage Status](https://coveralls.io/repos/github/railroadmedia/js-services/badge.svg?branch=master)](https://coveralls.io/github/railroadmedia/js-services?branch=master)

## Installation

### Yarn
`yard add @musora/services`

### NPM
`npm install @musora/services --save`

## Usage

### Configure the Instance

When your app starts up, you can call the `configue` method below to configure your current
request instance with some defaults, like the base url and the users authentication token.

```javascript
import { configure } from '@musora/services';

configure({
    baseUrl: 'https://drumeo.com/laravel/public',
    contentType: 'application/json',
    accept: 'application/json',
    authToken: '...'
});
```

### Entire Module
```javascript
import Services from '@musora/services';

Services.Railcontent.getContent(...);
```

### Individual Module
```javascript
import { Railcontent } from '@musora/services';

Railcontent.getContent(...);
```

### Individual Function
```javascript
import { getContent } from '@musora/services';

getContent(...);
```

## Local Development

- `yarn test` - Run all tests
- `yarn docs` - Auto generate documentation
npm package: @mussi/docsearch
Description: React package for DocSearch, the best search experience for docs.
Author: Algolia, Inc.
Latest version: 3.1.2-beta.0

# @docsearch/react

React package for [DocSearch](http://docsearch.algolia.com/), the best search experience for docs.

## Installation

```bash
yarn add @docsearch/react@3
# or
npm install @docsearch/react@3
```

If you don’t want to use a package manager, you can use a standalone endpoint:

```html
<script src="https://cdn.jsdelivr.net/npm/@docsearch/react@3"></script>
```

## Get started

DocSearch generates a fully accessible search box for you.

```jsx App.js
import { DocSearch } from '@docsearch/react';

import '@docsearch/css';

function App() {
  return (
    <DocSearch
      appId="YOUR_APP_ID"
      indexName="YOUR_INDEX_NAME"
      apiKey="YOUR_SEARCH_API_KEY"
    />
  );
}

export default App;
```

## Documentation

[Read documentation →](https://docsearch.algolia.com/docs/DocSearch-v3)
npm package: @mussi/vite
Description: Native-ESM powered web dev build tool
Author: Evan You
Latest version: 2.5.7

# vite ⚡

> Next Generation Frontend Tooling

- 💡 Instant Server Start
- ⚡️ Lightning Fast HMR
- 🛠️ Rich Features
- 📦 Optimized Build
- 🔩 Universal Plugin Interface
- 🔑 Fully Typed APIs

Vite (French word for "fast", pronounced `/vit/`) is a new breed of frontend build tool that significantly improves the frontend development experience. It consists of two major parts:

- A dev server that serves your source files over [native ES modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules), with [rich built-in features](https://vitejs.dev/guide/features.html) and astonishingly fast [Hot Module Replacement (HMR)](https://vitejs.dev/guide/features.html#hot-module-replacement).

- A [build command](https://vitejs.dev/guide/build.html) that bundles your code with [Rollup](https://rollupjs.org), pre-configured to output highly optimized static assets for production.

In addition, Vite is highly extensible via its [Plugin API](https://vitejs.dev/guide/api-plugin.html) and [JavaScript API](https://vitejs.dev/guide/api-javascript.html) with full typing support.

[Read the Docs to Learn More](https://vitejs.dev).
npm package: @mussi/vite-plugin-pages
Description: File system base vue-router plugin for Vite
Author: hannoeru
Latest version: 0.18.3-beta.2

# @mussi/vite-plugin-pages

[![npm version](https://badgen.net/npm/v/@mussi/vite-plugin-pages)](https://www.npmjs.com/package/@mussi/vite-plugin-pages)

[îles]: https://github.com/ElMassimo/iles
[vite-plugin-pages]: https://github.com/hannoeru/vite-plugin-pages

> File system based routing for Vue 3 applications using
> [îles]

_This is a temporary fork of [vite-plugin-pages] that adds a Javascript API to the plugin, which is used by [îles]._

## Getting Started

By default, files in the `src/pages` directory are automatically registered
as pages in the router.

## Configuration ⚙️

You can provide custom configuration by providing a `pages` option in your [îles] configuration file:

```js
// iles.config.ts
export default {
  pages: {
    pagesDir: 'src/views'
  },
}
```

See the [vite-plugin-pages] documentation for more information.
npm package: @mussi/vitepress-theme
Description: A vitepress theme for documentation websites.
Author: Maximo Mussini
Latest version: 1.0.2

[Vite Ruby]: https://github.com/ElMassimo/vite_ruby

# Vitepress Docs Theme

This is the [VitePress](https://vitepress.vuejs.org/) theme for the [Vite Ruby] docs.

It's based on the official [Vue documentation theme](https://github.com/vuejs/theme).


## Screenshots 📷

<img width="1728" alt="Screen Shot 2022-02-07 at 18 08 15" src="https://user-images.githubusercontent.com/1158253/152872961-3747f551-2497-4556-80ba-6139372fcb70.png">
<img width="1728" alt="Screen Shot 2022-02-07 at 18 08 24" src="https://user-images.githubusercontent.com/1158253/152872981-37ccc991-f01e-4e6c-a1db-31e3f4e4c0ad.png">