open-index/open-npm huggingface dataset:
npm package: @secretmapper/hello-wasm
Description: <div align="center">
Latest version: 0.1.0

<div align="center">

  <h1><code>wasm-pack-template</code></h1>

  <strong>A template for kick starting a Rust and WebAssembly project using <a href="https://github.com/rustwasm/wasm-pack">wasm-pack</a>.</strong>

  <p>
    <a href="https://travis-ci.org/rustwasm/wasm-pack-template"><img src="https://img.shields.io/travis/rustwasm/wasm-pack-template.svg?style=flat-square" alt="Build Status" /></a>
  </p>

  <h3>
    <a href="https://rustwasm.github.io/docs/wasm-pack/tutorials/npm-browser-packages/index.html">Tutorial</a>
    <span> | </span>
    <a href="https://discordapp.com/channels/442252698964721669/443151097398296587">Chat</a>
  </h3>

  <sub>Built with 🦀🕸 by <a href="https://rustwasm.github.io/">The Rust and WebAssembly Working Group</a></sub>
</div>

## About

[**📚 Read this template tutorial! 📚**][template-docs]

This template is designed for compiling Rust libraries into WebAssembly and
publishing the resulting package to NPM.

Be sure to check out [other `wasm-pack` tutorials online][tutorials] for other
templates and usages of `wasm-pack`.

[tutorials]: https://rustwasm.github.io/docs/wasm-pack/tutorials/index.html
[template-docs]: https://rustwasm.github.io/docs/wasm-pack/tutorials/npm-browser-packages/index.html

## 🚴 Usage

### 🐑 Use `cargo generate` to Clone this Template

[Learn more about `cargo generate` here.](https://github.com/ashleygwilliams/cargo-generate)

```
cargo generate --git https://github.com/rustwasm/wasm-pack-template.git --name my-project
cd my-project
```

### 🛠️ Build with `wasm-pack build`

```
wasm-pack build
```

### 🔬 Test in Headless Browsers with `wasm-pack test`

```
wasm-pack test --headless --firefox
```

### 🎁 Publish to NPM with `wasm-pack publish`

```
wasm-pack publish
```

## 🔋 Batteries Included

* [`wasm-bindgen`](https://github.com/rustwasm/wasm-bindgen) for communicating
  between WebAssembly and JavaScript.
* [`console_error_panic_hook`](https://github.com/rustwasm/console_error_panic_hook)
  for logging panic messages to the developer console.
* [`wee_alloc`](https://github.com/rustwasm/wee_alloc), an allocator optimized
  for small code size.
npm package: @secrets/asciinema-player-vue
Description: ## How to use
Latest version: 0.0.3

# asciinema-player-vue

## How to use

```bash
yarn install @secrets/asciinema-player-vue
```

```js
import AsciinemaPlayer' from '@secrets/asciinema-player-vue';
Vue.vue(AsciinemaPlayer);
```

public/index.html 手动引入 asciinema-player 的 js 和 css 文件，这个没办法，不然变量无法注入到 window 对象中

```html
<link rel="stylesheet" type="text/css" href="/asciinema-player.css" />
<script src="/asciinema-player.js"></script>
```

原插件中的 src 属性配置 cast 或者 json 文件会发起一个 http 请求,但是我们想配置一个 string。因此，在组件中我加入了 base64 来把配置文件变成 base64 格式的数据，像这样:`data:application/json;base64,xxxxxx`;但是就需要在自己工程里配置一个 loader,cast 文件内的数据，变成一个字符串传入就行了。后面的加密过程我会处理。

- 引入本地文件

```js
module.exports = {
  chainWebpack: (config) => {
    config.module
      .rule("cast")
      .test(/\.cast$/)
      .use("raw-loader")
      .loader("raw-loader")
      .end();
  }
};
```

- 引用服务器上资源

```html
:src="/YOUR_SERVER/xxx.cast"
```

如果有跨域就配置一个代理,开发环境直接配置 devServer.proxy,和调研普通 API 一样,会发起一个 GET 请求

## demo

在 example 文件夹中

参数配置和原生插件一样

```bash
yarn install && yarn serve
```