@tinajs/mina-loader

mina-loader

MINA single-file-component loader for Webpack.

Inspired by zezhipeng/mina-loader.

Installation

npm i --save-dev @tinajs/mina-loader webpack@^4.0.0

Note you'll have to use webpack 4.

Usage

/**
 * 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.

Options

Name	Default	Description
loaders	{ config: '', template: '', script: '', style: '' }	A map of Rules.use. See Webpack - Module - Rule.use for details.
loaders.config	''	The Rules.use for <config>.
loaders.template	''	The Rules.use for <template>
loaders.script	''	The Rules.use for <script>
loaders.style	''	The Rules.use for <style>
languages	{}	Used in the .mina file with the lang attribute. A map of Rules.use. See Webpack - Module - Rule.use for details.
extensions	{ config: '.json', template: '.wxml', style: '.wxss' }	The extension names of the emitted files
extensions.config	'.json'	The extension name of the file emitted with the <config> block
extensions.template	'.wxml'	The extension name of the file emitted with the <template> block
extensions.style	'.wxss'	The extension name of the file emitted with the <style> block
transform	(ast) => ast	Function used to transform mina AST before emitting files. Useful for translate mina into another language, such as Alipay Mini Programs or pure web pages
publicPath	output.publicPath	Useful for relative publicPath, see extract-loader - options
enforceRelativePath	true	The same option enforceRelativePath in wxml-loader, see wxml-loader - Usage. It is highly recommended to keep the default.

Example

• mina-webpack - Full Example
• mina-loader - test
• TinaJS - HackerNews Reader

License

Apache-2.0 © yelo, 2017 - present