Modelo de inicialização do projeto

O tempo todo, ao usar taro init os comandos Taro CLI para criar projetos, a CLI fornecerá vários modelos integrados para os desenvolvedores escolherem. No entanto, muitas equipes têm seus próprios cenários de negócios exclusivos e os modelos que precisam ser usados e mantidos não são consistentes. Portanto, o Taro suporta modelos de projeto de empacotamento em um recurso para desenvolvedores.

1.3.9 As seguintes modificações foram feitas na funcionalidade de modelo da CLI:

Apenas os modelos mais básicos default são mantidos na CLI, outros modelos são removidos.
A CLI lerá os itens de configuração de origem do modelo na configuração global da CLI e, em seguida, extrairá os modelos da origem do modelo para os desenvolvedores escolherem.
Os desenvolvedores podem usar seus próprios modelos modificando a origem do modelo .

fonte do modelo

A origem do modelo é o campo templateSource do item de configuração CLI , que pode ser operado com o comando taro config .

Origem do modelo padrão

A origem do modelo padrão é o warehouse taro-project-templates e os modelos integrados originais são extraídos aqui.

Configurar origem

A fonte do modelo suporta dois formatos, git template source e url template source .

fonte do modelo git

GitHub - github:proprietário/nome
GitLab - gitlab:proprietário/nome
Direto - direto:url

# 初始化项目时可以使用 --clone 选项指定拉取远程模板时使用git clone
taro init --clone

fonte do modelo de url

Uma url apontando para um pacote zip.

Escreva um modelo

Formato de organização do modelo

A organização do diretório de modelos suporta dois tipos, que são o modo de modelo único e o modo de grupo de modelos .

Modo de modelo único

git

package.json existe no diretório raiz do warehouse.

O nome do modelo é o nome do warehouse.

pacote zip

O pacote zip é descompactado em uma única pasta e o diretório raiz da pasta contém package.json.

O nome do modelo é o nome da pasta extraído do pacote zip.

Modo de grupo de modelos

git

Assim como a fonte de modelo padrão , vários modelos são armazenados no diretório raiz do warehouse.

O nome do modelo corresponde a todos os nomes de pasta no diretório raiz.

pacote zip

O pacote zip é descompactado em uma única pasta, que contém vários modelos.

O nome do modelo corresponde a todos os nomes de pasta na pasta.

modelo estático

Um modelo estático significa um modelo sem lógica, e a CLI percorrerá toda a pasta do modelo e copiará os arquivos para o local de destino, um por um.

Modelo Dinâmico

Em muitos casos, é necessário adicionar alguma lógica ao modelo para gerar conteúdo de modelo diferente de acordo com diferentes ambientes.

Os desenvolvedores podem adicionar o arquivo template_creator.js no diretório raiz do modelo, e o arquivo exporta objetos contendo o manipulador e os campos basePageFiles:

template_creator.js

function createWhenTs (params) {
  return params.typescript ? true : false
}

const handler = {
  '/global.d.ts': createWhenTs,
  '/tsconfig.json': createWhenTs,
  '/src/pages/index/index.jsx' ({ pageName }) {
    return { setPageName: `/src/pages/${pageName}/${pageName}.jsx` }
  },
  '/src/pages/index/index.css' ({ pageName}) {
    return { setPageName: `/src/pages/${pageName}/${pageName}.css` }
  }
}

const basePageFiles = [
  '/src/pages/index/index.jsx',
  '/src/pages/index/index.css'
]

module.exports = {
  handler,
  basePageFiles
}

linguagem de modelagem

Por favor, use ejs como a linguagem de modelo, e cada arquivo de modelo receberá parâmetros de modelo global.

Parâmetros padrão do modelo global (variáveis que podem ser usadas diretamente no modelo )

variável	tipo	ilustrar
Nome do Projeto	corda	Nome do item
descrição	corda	Descrição do Projeto
versão	corda	Versão CLI do Taro
data	corda	Carimbo de data/hora da criação do modelo
CSS	'nenhum' ou 'atrevido' ou 'stylus' ou 'menos'	Ferramenta de pré-processamento de estilo
cssExt	corda	sufixo do arquivo de estilo
texto datilografado	boleano	Se deve usar TS
nome da página	corda	`taro create` O nome da página passada, o padrão é 'index'
modelo	corda	nome do modelo

exemplo

index.js

<%if (typescript) {-%>
import Taro, { Component, Config } from '@tarojs/taro'
<%} else { -%>
import Taro, { Component } from '@tarojs/taro'
<%}-%>
import { View, Text } from '@tarojs/components'
import './<%= pageName %>.<%= cssExt %>'

campo do manipulador

handler é usado para controlar se deve gerar um arquivo ou passar parâmetros específicos para o arquivo.

manipulador: objeto

Atributos	tipo	valor
caminho de arquivo	função	função de processamento

O caminho do arquivo começa com "/", representando o diretório raiz da pasta do modelo

função de manipulação

parâmetros: objeto

Atributos	tipo	ilustrar
Nome do Projeto	corda	Nome do item
descrição	corda	Descrição do Projeto
versão	corda	Versão CLI do Taro
data	corda	Carimbo de data/hora da criação do modelo
CSS	'nenhum' ou 'atrevido' ou 'stylus' ou 'menos'	Ferramenta de pré-processamento de estilo
texto datilografado	boleano	Se deve usar TS
nome da página	corda	nome da página
modelo	corda	nome do modelo
templatePath	corda	caminho do modelo
projectPath	corda	Caminho de Destino
período	'createApp' ou 'createPage'	`taro init` Crie um projeto ou `taro create` crie uma página

retorno: booleano/objeto

Descrição do valor de retorno

valor	ilustrar
verdadeiro	Criar um arquivo
falso	não crie arquivo
objeto	Crie o arquivo e os campos do objeto retornado serão mesclados nos parâmetros do modelo global.

Se o valor de retorno for objeto, algumas de suas propriedades terão efeitos especiais:

Atributos	tipo	ilustrar
setPageName	corda	substituirá o caminho de saída do arquivo atual
mudarExt	boleano	Se o sufixo do arquivo deve ser substituído automaticamente

exemplo

Quando o usuário opta por usar typescript, os arquivos global.d.ts e tsconfig.json são gerados.

template_creator.js

function createWhenTs (params) {
  return params.typescript ? true : false
}

const handler = {
  '/global.d.ts': createWhenTs,
  '/tsconfig.json': createWhenTs
}

module.exports = { handler }

campo basePageFiles

basePageFiles instrui a CLI taro create a criar os seguintes arquivos quando um usuário cria uma página com o comando.

exemplo

Combine o campo do manipulador para criar uma nova página.

Quando o usuário usar o comando taro create --page=detail , serão criados dois arquivos /src/pages/detail/detail.jsx e /src/pages/detail/detail.css .

template_creator.js

const handler = {
  '/src/pages/index/index.jsx' ({ pageName }) {
    return { setPageName: `/src/pages/${pageName}/${pageName}.jsx` }
  },
  '/src/pages/index/index.css' ({ pageName}) {
    return { setPageName: `/src/pages/${pageName}/${pageName}.css` }
  }
}

const basePageFiles = [
  '/src/pages/index/index.jsx',
  '/src/pages/index/index.css'
]

module.exports = {
  handler,
  basePageFiles
}