# miniprogram-loader

> Mini Program single-file component loader for Webpack

Latest version **1.1.0** (published 2018-02-23) · MIT license · 0 weekly downloads

## Install

```sh
npm install miniprogram-loader
pnpm add miniprogram-loader
yarn add miniprogram-loader
bun add miniprogram-loader
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2018-02-23 |
| First published | 2018-02-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 7 |
| Author | kicoyu@126.com |
| Maintainers | kicoyu |
| Keywords | miniprogram, webpack, loader |

## Links

- npm: https://www.npmjs.com/package/miniprogram-loader
- Repository: https://github.com/CN-kicoyu/miniprogram-loader
- Homepage: https://github.com/CN-kicoyu/miniprogram-loader#readme
- Issues: https://github.com/CN-kicoyu/miniprogram-loader/issues
- npm.io page: https://npm.io/package/miniprogram-loader

## Dependencies (1)

- [loader-utils](https://npm.io/package/loader-utils.md) ^1.1.0

## Alternatives

- [raw-loader](https://npm.io/package/raw-loader.md) — 4.3M weekly downloads
- [plop](https://npm.io/package/plop.md) — 1.4M weekly downloads
- [webpack-deadcode-plugin](https://npm.io/package/webpack-deadcode-plugin.md) — 80.3K weekly downloads
- [@storybook/preact-vite](https://npm.io/package/@storybook/preact-vite.md) — 54.2K weekly downloads
- [vite-plugin-transform](https://npm.io/package/vite-plugin-transform.md) — 2.4K weekly downloads

## Recent versions

- 1.1.0 (latest) — 2018-02-23
- 1.0.0 — 2018-02-22

## README

# miniprogram-loader

> Mini Program single-file component loader for Webpack

### Install

```bash
npm install miniprogram-loader --save-dev
```

### Usage (e.g wechat)
**webpack.config.js**
```js
module.exports = {
  module: {
    rules: [
      {
        test: /\.kico$/,
        loader: 'miniprogram-loader',
        options: {
          htmlExt: 'wxml',
          cssExt: 'wxss',
          jsExt: 'js'
        }
      }
    ]
  }
}
```

### single-file component

```html
<template lang="pug">
  view.container
    view.userinfo
      button(wx:if="{{!hasUserInfo}}" open-type="getUserInfo") 获取头像昵称
      block(wx:else)
        text.userinfo-nickname {{userInfo.nickName}}
    view.usermotto
      text.user-motto {{motto}}
</template>

<script>
const app = getApp()

Page({
  data: {
    motto: 'Hello World',
    userInfo: {},
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo')
  },
})

</script>
<style lang="scss">
.userinfo {
  display: flex;
  flex-direction: column;
  align-items: center;
  h2 {
    background: red;
  }
}
</style>
```

---
_Source: https://npm.io/package/miniprogram-loader · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._