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

edpx-zhixin

v1.0.1

Published

edp zhixin package

Downloads

19

Readme

edpx-zhixin

Build Status Dependencies Status

edpx-zhixin是edp的一个扩展,提供给百度的FE开发搜索结果页模板的工具

启动edpx-zhixin

通过下面的命令,将根据默认的配置文件edpx-zhixin-config.js,启动edpx-zhixin,edpx-zhixin会在当前目录查找配置文件,如果没找到,会一直向上级目录查找,找到为止。在默认情况下,edpx-zhixin会使用8848作为默认端口,并且将当前目录作为 documentRoot

$ edp zhixin start
10:45:21 [INFO] monitor -> /Users/sekiyika/Documents/work/src
10:45:21 all plugins have been loaded.
edp INFO EDP WebServer start, http://192.168.1.106:8848
edp INFO root = [/Users/sekiyika/Documents/work/src/], listen = [8848]

指定配置文件

通过--config参数,可以指定edpx-zhixin的配置文件

$ edp zhixin start --config=src/edpx-zhixin-config.js
10:52:26 [INFO] monitor -> /Users/sekiyika/Documents/work/src
10:52:26 all plugins have been loaded.
edp INFO EDP WebServer start, http://192.168.1.106:8848
edp INFO root = [/Users/sekiyika/Documents/work/src/], listen = [8848]

目录结构

edpx-zhixin要求开发者遵循目录规范,如下:

edpx-zhixin-config.js
src
    page
        ecl_ec_weigou
            config.js
            _page.tpl
            page.tpl
            page.html
            data.json
            ...

配置edpx-zhixin

运行edp zhixin start时,需要edpx-zhixin-config.js文件,下面是构成edpx-zhixin-config.js的默认配置

/**
 * @file edpx-zhixin-config.js
 */

/**
 * edpx-zhixin的配置
 */
exports.server = {
    documentRoot: './', // documentRoot以配置文件所在的目录来计算绝对路径,默认为process.cwd()
    port: 8848 // edpx-zhixin的启动端口,默认为8848
};

/**
 * 用来配置开发环境依赖的结果页机器地址,可以配置线下机器
 * 默认hostname是www.baidu.com,port为80
 */
exports.proxy = {
    hostname: 'www.baidu.com',
    port: 80
};

/**
 * 如果网页中有同名模板,默认干掉同名模板
 */
exports.removeSameTpl = true;


/**
 * wise相关的host
 */
//exports.proxy = {
//    hostname: 'm.baidu.com',
//    port: 80
//};

/**
 * 指定php可执行的路径
 * @type {string}
 */
exports.php = 'php'; // 指定渲染模板使用的php路径,如果path中有,写php即可

/**
 * 指定依赖的base文件,默认会使用edpx-zhixin中自带的c_base.tpl和c_right_base.tpl文件
 */
exports.base = {
    left: 'c_base.tpl',
    right: 'c_right_base.tpl'
};

/**
 * wise相关的base文件
 */
// exports.base = 'wise';

###开发模板

从新建模板到release,都提供了相应的命令和工具

edp zhixin init

在行业目录下运行edp zhixin init ecl_fn_demo,如下:

$ edp zhixin init ecl_fn_demo
>> Do you really want to init `ecl_fn_demo` project in `/Users/sekiyika/Documents/work/src/finance` ?(y/n)y
>> There is a exist project, cover it ?(y/n)y
edp INFO >> `/Users/sekiyika/Documents/work/src/finance/page/ecl_fn_demo` create success.
...
edp INFO >> `/Users/sekiyika/Documents/work/src/finance/page/ecl_fn_demo/config.js` create success.

这样就构建好了一个模板开发所需的基本文件

edp zhixin initwise

创建wise相关的模板命令:

edp zhixin initwise [--root|-r] [--platform|-p] [--data|-d]

目前支持的wise平台为 iphone,utouch,big,在访问的时候url后缀添加

&tn=iphone、&tn=utouch、&tn=big, 切换到相应的平台

例如:

http://m.baidu.com/s?word=%E7%94%B7%E7%A7%91%E5%8C%BB%E9%99%A2&sa=tb&st=111041&tn=utouch

会调用utouch版本的模板

使用 utpl 支持模板编写

集成utpl的模板功能,在_page.tpl中引入后,自动编译成相关的函数使用, utpl语法同underscore.js的模板语法类似,请参考underscore 获取更多信息

例如:

_page.tpl 内容:

{%*include file="./ajax-list.utpl"*%}

注:形如:ajax-list.utpl会被编译成ajaxListRender函数,可以在js中直接调用

ajax-list.utpl 内容:

/*utpl:innerFn=false,strip=false*/
<!--列表项目-->
<ul>
    {%each(tplData.list, function (item, index) {%}
        <li><a href="{%=item.link%}">{%=escape(item.title)%}</a></li>
    {%});%}
</ul>
<!--记录数-->
{%var len = tplData.list.length;%}
{%if (len !== 0) {%}
    {%=len%}条记录
{%}%}

其中

/*utpl:innerFn=false,strip=false*/

为编译选项:

  1. innerFn=false,表示each,escape等函数不会在模板中内置,需要外部提供

  2. strip=false,表示不会自动去除空格、注释

config.js

config.js是每个模板目录下都需要的一个配置文件,主要包含和该模板相关的配置

exports.config = {
    tpl: 'ecl_fn_demo', // 模板名
    querys: [
        'iphone',  // 命中该模板时的query,不指定data会默认使用data.json文件作为数据文件
        {
            query: '游戏',
            data: 'data.json' // 指定渲染所需要使用的数据文件
        }
    ],
    side: 'left', // 模渲染的位置,有left和right的取值
    platform: ['ipad', 'pc'], // 该模板适用于ipad或者pc,根据url中的dsp参数来区分,可以为platform: 'pc'
    //platform: ['iphone', 'utouch', 'big'], //wise相关的platform,根据url中的tn参数来区分,tn=utouch,会切换到简版模板
    ajaxs: [ // 代理请求的数据,常用于代理/ecomui的请求
        {
            url: /a.js/,
            file: 'a_1.js', // file和handler是互斥的关系,handler优先级更高
            handler: function(request) {
                return fs.readFileSync('data.json')
            }
        }
    ],
    //build: 'release', // 缺省相当于 edp zhixin build,加上相当于 edp zhixin release (下文提及)
    watch: { // 监控源文件的变化并编译产出page.tpl文件
        filters: [
            '_page.tpl',
            '*.less'
        ],
        events: [
            'addedFiles',
            'modifiedFiles'
        ]
    }
};

edp zhixin start

edpx-zhixin启动时,会查找documentRoot目录下的所有config.js文件,然后根据config.js文件建立query到模板之间的索引

启动之后,可以通过http://127.0.0.1:8848访问

注意:在这里推荐配一个host,搜索结果���大部分静态文件都做了referrer过滤,非百度域可能会遇到403 forbidden,导致文件加载失败

edp zhixin build

build可以让用户手动编译生成page.tpl文件,代码不压缩

edp zhixin release

开发完成模板之后,需要发布压缩后的代码,releasebuild多做了一步就是编译压缩