{"id":21937613,"url":"https://github.com/cap32/wxml-loader","last_synced_at":"2025-04-22T12:12:20.646Z","repository":{"id":57097707,"uuid":"88143265","full_name":"Cap32/wxml-loader","owner":"Cap32","description":"wxml loader for webpack","archived":false,"fork":false,"pushed_at":"2018-12-28T13:15:02.000Z","size":194,"stargazers_count":32,"open_issues_count":3,"forks_count":11,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-22T12:12:13.590Z","etag":null,"topics":["alipay","alipay-mini-program","loader","mini-program","weapp","webpack","wechat","wechat-mini-program","wxapp","wxml","wxml-loader"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Cap32.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-04-13T08:35:03.000Z","updated_at":"2024-10-22T06:18:10.000Z","dependencies_parsed_at":"2022-08-20T16:50:51.098Z","dependency_job_id":null,"html_url":"https://github.com/Cap32/wxml-loader","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cap32%2Fwxml-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cap32%2Fwxml-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cap32%2Fwxml-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Cap32%2Fwxml-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Cap32","download_url":"https://codeload.github.com/Cap32/wxml-loader/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250237832,"owners_count":21397401,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["alipay","alipay-mini-program","loader","mini-program","weapp","webpack","wechat","wechat-mini-program","wxapp","wxml","wxml-loader"],"created_at":"2024-11-29T01:20:44.175Z","updated_at":"2025-04-22T12:12:20.627Z","avatar_url":"https://github.com/Cap32.png","language":"JavaScript","readme":"# wxml-loader\n\n[![CircleCI](https://circleci.com/gh/Cap32/wxml-loader.svg?style=shield)](https://circleci.com/gh/Cap32/wxml-loader)\n[![Build Status](https://travis-ci.org/Cap32/wxml-loader.svg?branch=master)](https://travis-ci.org/Cap32/wxml-loader)\n[![Build status](https://ci.appveyor.com/api/projects/status/kcp9grsyjd73n0lm?svg=true)](https://ci.appveyor.com/project/Cap32/wxml-loader)\n[![Coverage Status](https://coveralls.io/repos/github/Cap32/wxml-loader/badge.svg?branch=master)](https://coveralls.io/github/Cap32/wxml-loader?branch=master)\n[![npm version](https://badge.fury.io/js/wxml-loader.svg)](https://badge.fury.io/js/wxml-loader)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](http://makeapullrequest.com)\n[![License](https://img.shields.io/badge/license-MIT_License-blue.svg?style=flat)](https://github.com/Cap32/wxml-loader/blob/master/LICENSE.md)\n\nwxml loader for webpack\n\n**Please note this\n[wxml](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/view/wxml/) is a\nmarkup language for\n[Wechat mini programs](https://mp.weixin.qq.com/debug/wxadoc/dev/)**\n\n## Installation\n\n```bash\nyarn add -D wxml-loader\n```\n\n## Usage\n\nYou may also need to use\n[file-loader](https://github.com/webpack-contrib/file-loader) to extract files.\n\n```js\n{\n  test: /\\.wxml$/,\n  include: /src/,\n  use: [\n    {\n      loader: 'file-loader',\n      options: {\n        name: '[name].[ext]',\n        useRelativePath: true,\n        context: resolve('src'),\n      },\n    },\n    {\n      loader: 'wxml-loader',\n      options: {\n        root: resolve('src'),\n        enforceRelativePath: true,\n      },\n    },\n  ],\n}\n```\n\n##### Options\n\n* `root` (String): Root path for requiring sources\n* `enforceRelativePath` (Boolean): Should be true if you wish to generate a\n  `root` relative URL for each file. **It is recommend to set to `true`**\n* `publicPath` (String): Defaults to webpack\n  [output.publicPath](https://webpack.js.org/configuration/output/#output-publicpath)\n* `transformContent(content, resource)` (Function): Transform content, should\n  return a content string\n* `transformUrl(url, resource)` (Function): Transform url, should return a url\n* `minimize` (Boolean): To minimize. Defaults to `false`\n* All\n  [html-minifier](https://github.com/kangax/html-minifier#options-quick-reference)\n  options are supported\n\n## Known Issues\n\nCurrently `wxml-loader` could not resolve dynamic path, i.e.\n`\u003cimage src=\"./images/{{icon}}.png\" /\u003e`. Please use `copy-webapck-plugin` to\ncopy those resource to dist directory manually. See\nhttps://github.com/Cap32/wxml-loader/issues/1 for detail (Chinese).\n\n## For Alipay mini programs\n\nThis loader is also compatible with\n[Alipay mini programs](https://mini.open.alipay.com/channel/miniIndex.htm). You\njust need to make sure using `test: /\\.axml$/` instead of `test: /\\.wxml$/` in\nwebpack config.\n\nIf you're using\n[wxapp-webpack-plugin](https://github.com/Cap32/wxapp-webpack-plugin) and\nsetting `Targets.Alipay` as webpack target, it will automatically set\n`transformContent()` and `transformUrl()` option by default, the\n`transformContent()` function will transform `wx:attr` attribute to `a:attr`,\nand the `transformUrl()` function will transform `.wxml` extension to `.axml`\nautomatically. That means you could write mini programs once, and build both\nWechat and Alipay mini programs.\n\n###### Example\n\nwebpack.config.babel.js\n\n```js\nimport WXAppWebpackPlugin, { Targets } from \"wxapp-webpack-plugin\";\nexport default env =\u003e ({\n  // ...other\n  target: Targets[env.target || \"Wechat\"],\n  module: {\n    rules: [\n      // ...other,\n      {\n        test: /\\.wxml$/,\n        use: [\n          {\n            loader: \"file-loader\",\n            options: {\n              name: `[name].${env.target === \"Alipay\" ? \"axml\" : \"wxml\"}`\n              useRelativePath: true,\n              context: resolve('src'),\n            },\n          },\n          {\n            loader: 'wxml-loader',\n            options: {\n              root: resolve('src'),\n              enforceRelativePath: true,\n            },\n          },\n        ]\n      }\n    ]\n  },\n  plugin: [\n    // ...other\n    new WXAppWebpackPlugin()\n  ]\n});\n```\n\n## Related\n\nFor a complete guild to use `webpack` to develop `WeiXin App`, please checkout\nmy [wxapp-boilerplate](https://github.com/cantonjs/wxapp-boilerplate) repo.\n\n## License\n\nMIT\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcap32%2Fwxml-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcap32%2Fwxml-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcap32%2Fwxml-loader/lists"}