open-index/open-npm huggingface dataset:
npm package: @jx3box/jx3box-article-ui
Description: JX3BOX文章样式&编辑器内样式
Latest version: 0.3.1

# 文章内容样式与功能

### 方式一
```javascript
import '@jx3box/jx3box-article-ui/css/article.css'
```

### 方式二
```html
<link rel="stylesheet" href="https://console.cnyixun.com/static/jx3box-article-ui/dist/css/article.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/JX3BOX/jx3box-article-ui@version/dist/css/article.css" />
```

### 本地调试
```html
<link rel="stylesheet" href="http://localhost:1024/css/article.css" />
```


# todo
npm package: @jx3box/jx3box-battle
Description: 战斗日志分析脚本逻辑&前端公共组件
Latest version: 0.0.2

# jx3box-battle
战斗日志分析脚本逻辑&前端公共组件

## Doc
[数据字段说明文档](./docs/References.md)

## Web Component Dev
```
npm i
npm run serve
```
npm package: @jx3box/jx3box-bmap
Description: JX3BOX Baizhan Map
Latest version: 1.0.3

# 安装

```
npm install @jx3box/jx3box-bmap
```

# 使用

```
import BMap from '@jx3box/jx3box-bmap/src/components/BMap.vue'

<BMap :mode="mode"></BMap>

// mode: list simple
// default: simple
```
npm package: @jx3box/jx3box-build-common
Description: Utility library for JX3BOX build scripts
Latest version: 0.1.10

# jx3box-build-common  

数据表构建通用工具库
在进行数据构建的时候总是会遇到一些熟悉的操作  
比如需要一个日志输出器，tab，txt文件读取什么的。  
但是目前的写法是有一个utils.js文件里面写了一些各个构件库用的方法  
为了标准化，弄了这个仓库用于统一各个数据构建仓库中使用的方法  

```js
const {...} = require('@jx3box/jx3box-build-common');
```

## API

### UI

#### Logger

操作过程中需要往控制台输出当前进度、在干什么等等

- info
- warn
- error
- success

#### ProgressBar

用于展示一个进度条，在处理大文件的时候比较有必要  

- buildProgressBar

### File About

文件操作，用于读写文件  

#### 表格读

用于读写常见的表格文件，一般而言。剑三的游戏数据文件都是`GBK`编码的`tsv`格式  
即 字段之间使用`\t`分隔，第一行是标题，第二行是默认数据，第三行开始是数据体  
构建过程中要求读取这些数据文件之后进行自己的合表等操作  

- readTable

#### 其他文件读取

也会有一些文件采用ini格式，例如字体等各种枚举格式  
也有lua格式，`return {...}`

- readIni
- readLuaTable
- parseLua

#### 写文件

构建结果一般使用csv导出，如果对于较大的文件（超过100M）可能会需要做文件切片

- writeCsv
npm package: @jx3box/jx3box-comment-ui
Description: ## 1.安装 ``` npm --registry https://registry.npmjs.org install @jx3box/jx3box-comment-ui ```
Latest version: 2.0.10

# comment-vue

## 1.安装
```
npm --registry https://registry.npmjs.org install @jx3box/jx3box-comment-ui
```

## 2.引入

```javascript
import Comment from "@jx3box/jx3box-comment-ui/src/Comment.vue";
```

## 3.调用
```
<Comment :id="id" category="wiki" order="desc" />
```
+ category : 评论所属分类，一般使用应用标识符，比如文章post、试卷paper、百科wiki等
+ id : 分类下的主键id
+ order: 排序类型，默认为 asc， 可选 desc

> 为了对消息通知友好， 一般消息 wp_messages 表中的sourceType需要什么就填什么，［文章除外，文章类型使用　'post', 服务器会进行处理，需要二次查询文章具体类别］  
比如对于试卷的评论组件， wp_messages 表中的sourceType需要的是 paper 那么　category="paper"  


## 旧版线上引用
对gh-pages发布release
```html
<script src="https://cdn.jsdelivr.net/gh/JX3BOX/jx3box-comment-ui@1.0.0/comment.umd.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/JX3BOX/jx3box-comment-ui@1.0.0/comment.css" />
```

## 使用评论的项目
+ cms (macro,jx3dat,fb,bps,tool,bbs,share)
+ bbs (exam,collection,emotion,joke)
+ wiki (item,knowledge,quest)
+ app (pz,team,battle,dbm)
npm package: @jx3box/jx3box-common
Description: JX3BOX公共基础模块
Latest version: 9.2.2

# JX3BOX

公共基础函数模块，路径常量，外部通用接口地址，全局主题等

## Step.1 Install

```
$ npm install @jx3box/jx3box-common --save
```

## Step.2 Import

```javascript
import { JX3BOX } from "@jx3box/jx3box-common";
import User from "@jx3box/jx3box-common/js/user.js";
```

## Js & Data Docs

- [utils](./docs/utils.md) 常用工具函数&过滤器等（获取落地页链接、图像处理等）
- [user](./docs/user.md) 获取用户本地缓存信息（头像，用户名，用户组，是否登录等）
- [stat](./docs/stat.md) 统计
- [axios](./docs/axios.md) 拦截器
- [https](./docs/https.md) 请求封装
- [types](./docs/types.md) 类型定义


## 外部lib
+ font-awesome：`<link href="https://cdn.jx3box.com/lib/css/font-awesome/7.1.0/css/all.min.css" rel="stylesheet" />`
+ lucide：`<script src="https://cdn.jx3box.com/lib/lucide/0.577.0/lucide.min.js"></script>`
npm package: @jx3box/jx3box-common-ui
Description: JX3BOX UI
Latest version: 9.5.27

# JX3BOX UI

通用 UI 组件

## Step.1 Install

```
npm install @jx3box/jx3box-common-ui
```

## Step.2 Import

-   基础布局(标准三栏布局,公共头底,侧边栏)

```javascript
import JX3BOX_UI from "@jx3box/jx3box-common-ui";
Vue.use(JX3BOX_UI);
```

-   指定模块

```javascript
import xx from "@jx3box/jx3box-common-ui/src/xx.vue";
Vue.component(xx.name, xx);
```

# 新增公共组件流程

1. 打开 index.js,添加对应模块

```javascript
import Fav from "./src/Fav.vue";
const components = {
    ...Fav,
};
```

2. 打开 src/App.vue,引入模块作为测试预览

```javascript
import Fav from "./Fav.vue";
components: {
    ...
    Fav
},
```

3. 在 src/下新建\$module.vue
   参考其他模块

# 在页面远程引入公共头
1. 头部引入文件

```html
<script src="https://oss.jx3box.com/static/jx3box-lib/vue.js"></script>
<script src="https://oss.jx3box.com/static/jx3box-common-ui/newheader.umd.min.js"></script>
<link rel="stylesheet" href="https://oss.jx3box.com/static/jx3box-common-ui/newheader.css"/>
```

2. 需要插入的位置

```html
<div id="app">
    <newheader></newheader>
</div>
```

3. 初始化脚本

```html
<script>
new Vue({
    components: {
        newheader: newheader,
    },
}).$mount("#app");
</script>
```
npm package: @jx3box/jx3box-config
Description: JX3BOX公共基础模块
Latest version: 1.0.6

# JX3BOX
公共基础模块，路径常量，外部通用接口地址等

## Step.1 Install
`npm install @jx3box/jx3box-config`  

## Step.2 Import
+ 路径常量
```
const {JX3BOX} = require('@jx3box/jx3box-config');
```