0.0.1 • Published 4 years ago
taro-page-plugin v0.0.1
taro-page-plugin
Taro 生成页面/组件生成插件
安装
在 Taro 项目根目录下安装
$ npm i taro-page-plugin --save使用
引入插件
修改项目 config/index.js 中的 plugins 配置为如下
const config = {
...
plugins: [
...其余插件
['taro-page-plugin',{
css:'scss',// 默认 scss
version: 3// taro 版本默认 3
}]
]
...
}插件配置
taro-page-plugin 插件支持以下参数
| 参数项 | 类型 | 是否可选 | 用途 | 默认值 |
|---|---|---|---|---|
| css | string | 是 | 指定 css 类型,可选择 none,sass,less, | scss |
| version | number | 是 | 指定 Taro 版本,可选 2、3, | 3 |
这样可通过
taro template 参数来自动化创建页面
命令行参数
taro-page-plugin 插件支持以下参数
| 参数项 | 类型 | 是否可选 | 用途 |
|---|---|---|---|
| --component | string | 是 | 创建一个组件/页面级组件 |
| --page | string | 是 | 创建一个页面 |
| --subpackages | string | 是 | 创建一个页面 |
使用案例
1.创建项目组件
taro template --component Button生成结果:
-- 组件: components/Button/Button.tsx
-- 组件样式: components/Button/Button.scss2.创建页面组件
taro template --component index/Button // index为页面文件夹名称,自动生成为 pages/index生成结果:
-- 组件: pages/index/components/Button/Button.tsx
-- 组件样式: pages/index/components/Button/Button.less3.创建页面
taro template --page/subpackages Detail生成结果:
-- 页面: pages | subpackages /Detail/Detail.tsx
-- 页面配置: pages | subpackages /Detail/Detail.config.tsx
-- 页面样式: pages | subpackages /Detail/Detail.scss4.创建页面(指定具体页面名称)
taro template --page/subpackages index/search生成结果:
-- 页面: pages | subpackages/index/search.tsx
-- 页面配置: pages | subpackages/index/search.config.tsx
-- 页面样式: pages | subpackages/index/search.less