npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

create-teamix

v0.0.53

Published

Using the command-line to create standard TXD front-end applications.

Downloads

7

Readme

create-teamix

create-teamix 是 Teamix 前端工程配套的命令行工具,提供了新建应用、添加页面等功能。相比于直接使用 create-teamix,我们更推荐你使用封装了它的 Teamix VSCode 插件

创建 teamix 应用

tnpx 方式

$ tnpx create-teamix <project-directory>

如果之前已通过 npm install -g create-teamix 全局安装了 create-teamix,建议您使用 npm uninstall -g create-teamix 卸载软件包,以确保 npx 始终使用最新版本。 (npx 是一个包运行工具,从 npm v5.2 开始,增加了 npx 命令。

tnpm 方式

tnpm init <initializer> 需要 tnpm 6+ 版本才能使用。

$ tnpm init teamix <project-directory>

或者

$ tnpm create teamix <project-directory>

或者

$ create-teamix <project-directory>

使用

参数说明

  -V, --version                         output the version number
  --type <template-name>                指定样板工程类型,可选值: spa|uiless|micro|mpa|ssr|h5|ascm|aso
  --language <typescript | javascript>  指定语言
  --install                             是否自动安装依赖,默认自动安装
  --start                               是否自动启动服务,默认不启动服务
  --branch                              指定样板工程代码库的分支
  --theme                               主题,包括颜色和明暗,可选值:teambition|teambition-dark|apsara|apsara-dark
  --dm                                  默认显示明暗哪种主题,默认明色,可选值:bright|dark
  --nav                                 导航类型,可选值:default|apsara|infra|teambition
  --sidebar                             是否显示左侧栏,默认显示
  --visualization                       是否包含可视化图表,默认不包含
  --repository                          代码仓库地址,可不填
  -h, --help                            output usage information

--type

样板工程类型。可选值有:

  • spa - SPA 单页面应用
  • uiless - 微前端 UILess 组件.
  • micro - 微前端宿主应用.
  • mpa - 多页面应用.
  • ssr - 服务端渲染应用.
  • h5 - 移动应用.

--language

语言类型。可选值有:

  • typescript
  • javascript

--install

是否自动安装依赖。可选值有:

  • true[default]
  • false

--start

是否自动启动服务。可选值有:

  • true
  • false[default]

--theme

主题,包括颜色和明暗。可选值有:

  • teambition Teambition 产品的默认主题。
  • teambition-dark Teambition 产品的暗色主题(并无实用场景)。
  • apsara 专有云控制台的明色主题。
  • apsara-dark 专有云控制台的暗色主题。

--dm

默认显示「明」「暗」哪种主题,默认明色,可选值:

  • bright 明色
  • dark 暗色

--nav

吊顶导航

  • default 默认导航为空
  • apsara 专有云导航
  • infra 天基导航
  • teambition Teambition 导航

--sidebar

是否显示左侧栏,默认显示。可选值有:

  • true[default]
  • false

--visualization

是否包含可视化图表,默认不包含。图表库资源如下 亮色主题:index(默认) 暗色主题:dark 专有云主题:aliyun 专有云暗色主题:aliyun-dark

  • true
  • false[default]

--repository

代码仓库地址,可不填

示例

$ tnpx create-teamix myspa

 选择样板工程类型: (Use arrow keys)
❯ SPA - 单页面应用
  Micro frontends - 微前端 UILess 组件
  Micro frontends - 微前端宿主应用
  Visualization - 可视化应用
  MPA - 多页面应用
  SSR - 服务端渲染工程
  Apsara - 专有云前端应用

? 选择语言类型? (Use arrow keys)
❯ TypeScript
  JavaScript

🍵 正在创建 SPA 单页面应用到 {目标目录}

🍵 开始安装依赖
🦄 依赖安装完成

🎉 成功初始化工程!

接下来你可以:
   进入工程目录
     $ cd teamix1

   去 Gitlab 新建项目,并上传到git
     $ git remote add origin [email protected]
     $ git add .
     $ git commit
     $ git push -u origin master

   开发调试
     $ tnpm start

   打包构建
     $ tnpm run build

   发布日常
     $ def p -d

   发布线上
     $ def p -o

或者

$ tnpx create-teamix myspa --type spa --language typescript

创建业务工程

专有云 SPA 应用【JS】

只有专有云才会出现没有侧边栏的情况,并且专有云应用一般自带可视化图表

$ tnpx create-teamix apsara-spa --language javascript --type spa --theme apsara --nav apsara --sidebar false --visualization

暗色

$ tnpx create-teamix apsara-spa --language javascript --type spa --theme apsara --dm dark --nav apsara --sidebar false --visualization

天基 SPA 应用【JS】

$ tnpx create-teamix infra-spa --language javascript --type spa --theme infra --nav infra --sidebar

暗色

$ tnpx create-teamix infra-spa --language javascript --type spa --theme infra --dm dark --nav infra --sidebar

天基 MPA 应用,内置特殊组件库 AISC

$ tnpx create-teamix infra-mpa --language javascript --type mpa --theme infra --nav infra --sidebar --component aisc --visualization

Teambition SPA 应用【JS】

$ tnpx create-teamix teambition-spa --language javascript --type spa --theme teambition --nav teambition

过程

  • 检查安装环境 Node > 9.0.0
  • 检查路径为空或空文件夹,用户确认是否覆盖
  • 选择样板工程类型,执行各工程初始化(包括选择语言类型)
  • 初始化工程完成
  • 自动「安装依赖」
  • 根据参数 start 判断是否默认自动「启动服务」

添加 teamix 模板页面

tnpx

$ tnpx create-teamix add <srcPagesName> --template <templateProject> --target <targetPath> --route <routePath> --title <PageTitle> --pageName <pageName>

示例

$ tnpx create-teamix add indexList --target src/pages
$ tnpx create-teamix add form1 --target src/pages --route /form-bo --title 产品名bo --pageName form-bo

添加可视化页面模板示例,先创建一个天基 SPA

$ tnpx create-teamix infra-spa --language javascript --type spa --theme infra --dm dark --nav infra --sidebar
$ tnpx create-teamix add dashboard --target src/pages --route /dashboard --title testDashboard --pageName testDashboard --template @alife/at-design-pro-for-visualization

使用

参数说明


<srcPagesName> 默认模板工程 @txdfe/at-design-pro/src/pages 下的文件名/路径
--template 模板工程,目前支持的模板工程,默认值:@alife/at-design-pro,可选值:@alife/at-design-pro-for-visualization
--target 指定添加页面到目标路径下,默认是执行命令行的所在路径下的 src/pages 目录
--route 指定路由,默认和 <srcPagesName> 的路由约定一致,具体值可在 @txdfe/at-design-pro/src/route/route.js 中查看
--title 标签页标题,默认和 <srcPagesName> 的标题一致,具体值可在 @txdfe/at-design-pro/src/route/route.js 中查看
--pageName 用户工程中 src/pages 下的文件名

删除 teamix 模板页面

tnpx

$ tnpx create-teamix delete <routeName> --rootPath <rootPath>

或者

$ tnpx create-teamix del <routeName> --rootPath <rootPath>

使用

参数说明

  <routeName>            命令行的所在路径查找 route/routes.json , 并删除对应的路由
  --rootPath             指定工程根目录,非必填,默认为当前目录

修改 teamix 模板页面

tnpx

$ tnpx create-teamix update <routeName> --route <newRouteName> --title <newTitle> --rootPath <rootPath>

或者

$ tnpx create-teamix edit <routeName> --route <newRouteName> --title <newTitle> --rootPath <rootPath>

使用

参数说明

  <routeName>            命令行的所在路径查找 route/routes.json , 并修改对应的路由
  --route                新路由
  --title                新标签页标题
  --rootPath             指定工程根目录,非必填,默认为当前目录

初始化模板工程的 meta 信息

执行命令后会更新 pro 目录下对应模板工程的页面 meta 信息。注意:更新 meta 信息前,需要重新安装模板工程。

tnpx

$ npm uninstall -S @alife/at-design-pro
$ npm i -S @alife/at-design-pro
$ tnpx create-teamix meta <templateProject>

使用

参数说明

  <templateProject>      模板工程,默认值:@alife/at-design-pro

示例用法

$ npm uninstall -S @alife/at-design-pro-for-visualization
$ npm i -S @alife/at-design-pro-for-visualization
$ tnpx create-teamix meta @alife/at-design-pro-for-visualization

初始化 Site Map 结构包

tnpx

$ tnpx create-teamix sitemap <projectDirectory> --siteMapTemplate <templateProject> --language javascript

使用

参数说明

  <projectDirectory>       工程路径名称
  --siteMapTemplate        指定样板工程类型,可选值: apsara|infra|teambition
  ...                      其他参数同初始化工程参数

示例用法

创建 Teambition Site Map 结构包

$ tnpx create-teamix sitemap teambition-sitemap-demo --siteMapTemplate teambition --language javascript --type spa

创建 天基 Site Map 结构包【暂不可用】

$ tnpx create-teamix sitemap infra-sitemap-demo  --siteMapTemplate infra --language javascript --type spa --theme infra --dm dark --nav infra --sidebar

创建 专有云 Site Map 结构包【暂不可用】

$ tnpx create-teamix sitemap apsara-sitemap-demo  --siteMapTemplate apsara --language javascript --type spa --theme apsara --dm dark --nav apsara --sidebar

License

MIT