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

sfr-cli

v1.1.2

Published

superframe tools package, for init sf project & debuger & validate sf service etc.

Downloads

6

Readme

sfr-cli

简介

主要用于superframe的service接入开发调试。提供脚手架,dev环境,准入规范检测等功能。方便各产品线只要在准备好接口的前提下就能够顺利接入superframe。

用法

安装

npm install -g sfr-cli

检验是否安装成功:

sf -h

可以cd到产品线代码所在目录,或者任何目录(此目录将永远为sfr-cli的一个项目的根目录)

cd /project/root/path

或者:

cd /some/path

mkdir sfr-dev

cd sfr-dev

初始化环境:

sf init

这个时候项目的根目录会出现一个superframe.config.js文件,这个文件为sfr-cli的全局配置文件。 可以对这个文件进行自定义配置,从而达到调试的目的。

配置superframe.config.js

/**
 * @file superframe cli config
 * @author @superframe
 */

module.exports = {
    proxy: {

        // 代理到的环境host, 默认为m.baidu.com
        host: 'm.baidu.com',

        // 代理环境port, 默认为80
        port: 80
    },

    server: {

        // 启动服务器的端口
        port: 8867,

        // 是否允许跨域, 默认为true
        crossDomain: false
    },

    registers: [
        {
            id: 'xxx',
            path: /^\/sf_xxx\//,
            service: './services/xxxService.js' // 相对于superframe.config.js的文件目录
        }
        // ,
        // {
        //     可以注册多个...
        // }
    ],

    // 自定义基于注册了的path的mock入口
    paths: [
        {
            // path的名称,要求格式`/sf_产品线标示名称`
            path: '/sf_xxx/xxx',

            alias: '别名', // 方便管理调试

            // 异步接口和同步接口请求的参数, 也可以直接在async, sync中的url中定义
            querys: {
                q: 'xxxx',

                // 配置头部样式
                top: JSON.stringify({sfhs: 2})
            },

            // 同步接口,要求path与mock的path去掉/sf_xxx相同, 如/sf_xxx/xxx则对应同步path为 http://localhost:8848/xxx
            sync: 'http://localhost:8848/xxx',

            // 异步接口
            async: 'http://localhost:8848/sf/async',

            // 配置项,对应到data-sf-options属性,配置头部的样式等。
            options: {
                view: {

                    // 外层dom的classname
                    customClassName: 'sf-xxx-xxx',

                    // 这里直接注入头部dom就行,样式在sf style里写
                    headTitle: ''
                        + '<div class="sf-xxx-xxx-header">'
                        +     '<p class="header-title">'
                        +         '<span class="logo"></span>'
                        +     '</p>'
                        +     '<div class="share-wrap"></div>'
                        + '</div>',
                    headTool: '',
                    headClose: false,
                    useAnimate: true,
                    _hold: 1
                }
            }
        }

        // 可以mock多个入口path
        // ,
        // {
        //     ...
        // }
    ]
};

配置完成后,可以启动调试了,执行以下命令

sf preview

如果没有意外的话,将会看到

SF INFO Sf WebServer start, http://172.18.25.124:8867
SF INFO root = [/some/path/xxx/xxx], listen = [8867]

如果报一下错误,则是因为server端口被占用

图片

可以执行以下命令变更port

sf preview --port=8099

如果一切ok, 就可以直接访问命令行中的ip + port就行了,如http://172.18.25.124:8867

这个时候就能看到百度首页了,在里面随意输入某个query,就能进入到开发结果页。

图片

点击/sf_xxx , 如果异步url接口和同步url接口配置正确的话,将会调起superframe。

注意事项

  • 新升级之后的sfr-cli 1.1.0版本后不支持sf2.0开发
  • sfr-cli 1.1.0版本后, 支持开发sf2.5, 需要自行开发产品线接入service, 开发教程:教程

TODO

主要开发调试功能ok, 部分功能还在完善中。。