Home

Awesome

Webpack Plugin For Jscc

简介

webpack-plugin-jscc是支持代码级的条件编译能力一个插件

使用

安装

yarn add webpack-plugin-jscc

常规使用

import JsccPlugin from 'webpack-plugin-jscc'

JsccPlugin的参数说明

参数类型说明默认值
extsArray<string>需要解析的文件['vue', 'js', 'ts', 'css', 'stylus', 'less', 'scss']
valuesObject注入的业务环境标识{_PLATFORM: 'web'}
excludesArray<string>不做处理的文件[/node_modules/] 
plugins: [
  new JsccPlugin({
    values: {
        _PLATFORM: 'web', // 匹配业务环境标识
    }
  })
]

条件编译业务书写规则

更多 jscc 高级用法，可以参考 jscc 文档

js/ts:

//#if _PLATFORM==='web'
console.info('【js/ts】 in web')
//#else
console.info('【js/ts】 in other')
//#endif

vue:

<template>
  <div class="view">
    <!--#if _PLATFORM==='web'  //-->
    <HelloWorld msg="Welcome to web!"/>
    <!--#else //-->
    <HelloWorld msg="Welcome to other!"/>
    <!--#endif //-->
  </div>
</template>

css:

/*#if _PLATFORM==='web' //*/ 
.web {
    height: 10px
  }
/*#endif //*/

TODO