https://github.com/fe6/water-loader

统一的 Water 标签编写规范
https://github.com/fe6/water-loader

Last synced: 4 months ago
JSON representation

统一的 Water 标签编写规范

• Host: GitHub
• URL: https://github.com/fe6/water-loader
• Owner: fe6
• License: mit
• Created: 2019-12-30T02:30:22.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T13:16:02.000Z (over 2 years ago)
• Last Synced: 2024-03-25T03:21:57.888Z (over 1 year ago)
• Language: JavaScript
• Size: 1.39 MB
• Stars: 0
• Watchers: 2
• Forks: 1
• Open Issues: 21
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# water-loader

> 统一的 Water 标签编写规范

[![@fe6/water-loader](https://img.shields.io/npm/v/@fe6/water-loader.svg?style=flat-square)](https://www.npmjs.org/package/@fe6/water-loader)

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)

## 预览

可进入 `./demo/` 文件夹，安装以来之后，执行 `npm start` ，进行查看。

##### 若 `Button` 转译成 `w-button`

不需要加参数，效果如下

1. 转译前：

![Button](./img/loader1.png)

2. 转移后：

![w-button](./img/loader3.png)

##### 若 `w-button` 转译成 `Button`

需要在 `./demo/webpack.config.js` 中加 `prefix: true` ，效果如下

1. 转译前：

![Button](./img/loader2.png)

2. 转移后：

![w-button](./img/loader4.png)

## 使用

```js

// 配置 webpack.config.js

module.exports = {

  // ... 省略其他配置

  module: {

    rules: [

      {

        test: /\.vue$/,

        use: [

          // ... 省略其他配置

          {

            loader: '@fe6/water-loader',

            options: {

              prefix: true, // `w-button` 转译成 `Button`

            },

          },

        ],

      },

    ],

  },

};

```

## 说明

引用了 [water-helper-maps](https://github.com/fe6/water-helper-maps) 中的标签对照。完整标签请移步 [water-helper-maps](https://github.com/fe6/water-helper-maps/blob/master/src/maps/water-tags.json) 。