# @tinajs/mina-loader > MINA single-file-component loader for Webpack Latest version **1.10.0** (published 2020-12-07) · Apache-2.0 license · 0 weekly downloads ## Install ```sh npm install @tinajs/mina-loader pnpm add @tinajs/mina-loader yarn add @tinajs/mina-loader bun add @tinajs/mina-loader ``` ## Health **Score 25/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned. ## Facts | | | |---|---| | Version | 1.10.0 | | Published | 2020-12-07 | | First published | 2017-11-28 | | Weekly downloads | 0 | | License | Apache-2.0 | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 21 | | Unpacked size | 68.6 KB | | Known vulnerabilities | 0 (+6 in 2 direct dependencies) | | Install scripts | no | | GitHub stars | 91 | | Author | yelo | | Maintainers | malash, jimexist, yelo | ## Links - npm: https://www.npmjs.com/package/@tinajs/mina-loader - Repository: https://github.com/tinajs/mina-webpack - Homepage: https://github.com/tinajs/mina-webpack/tree/master/packages/mina-loader#readme - Issues: https://github.com/tinajs/mina-webpack/issues - npm.io page: https://npm.io/package/@tinajs/mina-loader ## Dependencies (21) - [debug](https://npm.io/package/debug.md) ^4.1.1 - [json5](https://npm.io/package/json5.md) ^2.1.0 - [p-all](https://npm.io/package/p-all.md) ^1.0.0 - [p-map](https://npm.io/package/p-map.md) ^2.0.0 - [postcss](https://npm.io/package/postcss.md) ^7.0.27 - [resolve](https://npm.io/package/resolve.md) ^1.10.0 - [css-loader](https://npm.io/package/css-loader.md) ^3.4.2 - [raw-loader](https://npm.io/package/raw-loader.md) ^1.0.0 - [object-path](https://npm.io/package/object-path.md) ^0.11.4 - [postcss-url](https://npm.io/package/postcss-url.md) ^8.0.0 - [replace-ext](https://npm.io/package/replace-ext.md) ^2.0.0 - [loader-utils](https://npm.io/package/loader-utils.md) ^1.2.3 - [lodash.merge](https://npm.io/package/lodash.merge.md) ^4.6.1 - [resolve-from](https://npm.io/package/resolve-from.md) ^5.0.0 - [style-loader](https://npm.io/package/style-loader.md) ^0.23.1 - [extract-loader](https://npm.io/package/extract-loader.md) ^3.1.0 - [@tinajs/mina-sfc](https://npm.io/package/@tinajs/mina-sfc.md) ^0.2.2 - [compose-function](https://npm.io/package/compose-function.md) ^3.0.3 - [ensure-posix-path](https://npm.io/package/ensure-posix-path.md) ^1.1.1 - [@tinajs/wxml-loader](https://npm.io/package/@tinajs/wxml-loader.md) 0.3.1-fork.2 - [vue-template-compiler](https://npm.io/package/vue-template-compiler.md) ^2.6.7 ## Recent versions - 1.10.0 (latest) — 2020-12-07 - 1.9.3 — 2020-06-21 - 1.9.2 — 2020-06-09 - 1.9.1 — 2020-05-25 - 1.9.0 — 2020-03-16 - 1.8.3 — 2020-03-16 - 1.8.2 — 2020-03-16 - 1.8.1 — 2020-03-11 - 1.8.0 — 2020-01-21 - 1.7.2 — 2019-10-13 - 1.7.1 — 2019-09-29 - 1.7.0 — 2019-09-27 - 1.6.0 — 2019-08-15 - 1.5.2 — 2019-07-04 - 1.5.1 — 2019-05-08 - … 48 more at https://npm.io/package/@tinajs/mina-loader/versions ## README # mina-loader > [MINA single-file-component](https://tinajs.github.io/tina/#/guide/package-management-and-build-tools) loader for [Webpack](https://webpack.js.org/). [![npm](https://img.shields.io/npm/v/@tinajs/mina-loader.svg?style=flat-square)](https://www.npmjs.com/package/@tinajs/mina-loader) [![npm](https://img.shields.io/npm/dw/@tinajs/mina-loader.svg?style=flat-square)](https://www.npmjs.com/package/@tinajs/mina-loader) [![license](https://img.shields.io/npm/l/@tinajs/mina-loader.svg?style=flat-square)](./LICENSE) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) _Inspired by [zezhipeng/mina-loader](https://github.com/zezhipeng/mina-loader)._ ## Installation ```bash npm i --save-dev @tinajs/mina-loader webpack@^4.0.0 ``` Note you'll have to use webpack 4. ## Usage ```javascript /** * webpack.config.js */ module.exports = { context: resolve('src'), mode: 'production', entry: { 'app.mina': './app.mina', 'pages/home.mina': './pages/home.mina', }, output: { path: resolve('dist'), filename: '[name]', publicPath: '/', }, module: { rules: [ { test: /\.mina$/, use: { loader: '@tinajs/mina-loader', /** * see Options */ options: { loaders: { script: 'babel-loader', style: { loader: 'postcss-loader', options: { config: { path: resolve('./postcss.config.js'), }, }, }, }, languages: { less: 'less-loader', }, }, }, }, ], }, } ``` For the best particle, you might also be interested in [mina-webpack](https://github.com/tinajs/mina-webpack/). ## Options | Name | Default | Description | | ------------------- | ----------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | loaders | `{ config: '', template: '', script: '', style: '' }` | A map of _Rules.use_. See [Webpack - Module - Rule.use](https://webpack.js.org/configuration/module/#rule-use) for details. | | loaders.config | `''` | The _Rules.use_ for ``. | | loaders.template | `''` | The _Rules.use_ for `