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

wenke-dev

v13.2.5

Published

dev tool for wenke-webpack

Downloads

95

Readme

wenke-dev npm version

NPM

wenke-dev 实时开发辅助工具:

  • 1、支持ES6/7/8、TypeScript、React、SASS、CSS、iconfont、图片等静态资源实时构建为浏览器端正常运行的ES5代码
  • 2、支持React SSR
  • 3、支持React同构渲染
  • 4、支持HMR热更新

安装

npm install -g wenke-dev

使用说明

wenke-dev -w Node.js工程目录(同时构建多个工程请用"," 英文逗号分隔)

目录规范说明

js 文件引入规范

在 Node.js 模板中引入的 JS 主要有 2 种情况:

  1. 直接引入 CDN 中的 JS, 这种引入方法会被 wenke-dev 排除在编译列表之外;

  2. 具体页面入口 JS 文件, 例如:

    <script src="/sf/deploy/js/project1/page1/bundle.js"></script>

注意: 项目中页面入口文件名必须为: main.js,main.js构建后会在deploy目录下生成bundle.js。

Node.js 工程文件目录

Node.js 工程下的模板文件目录必须要有 src 目录,如下:

views
└─src

构建后的模板文件会放置在与 src 同级目录下的 deploy 目录,无需用户手动创建,构建时会自动建立,编译后的目录结构如下:

views
├─deploy
└─src

静态资源文件目录

静态资源根目录下必须要有 src 目录,例如静态资源根目录为 static 的话,如下:

static
└─src

由于使用了webpack-dev-server构建静态资源,因此需要在本地配置转发规则。

命令行参数说明

-w 必需

Node.js工程文件目录(同时构建多个工程请用"," 英文逗号分隔)

--livereload-port

livereload 服务端口, 默认为: 8999

--style

编译 sass、iconfont、图片等样式相关静态文件

-c

common-library工程路径

--hmr

启用热更新与内存IO

--esbuild

启用esbuild

--smp

启用speed-measure-webpack-plugin

--ba

启用webpack-bundle-analyzer

--disableforceupdate

禁用强制更新

Report an issue

欢迎大家将使用 wenke-dev 中遇到的任何问题提交给我,提问地址:Report an issue

Pull Requests

如果您发现了代码中的问题,可以 New pull request

License

wenke-dev 使用 MIT License