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

genertor-test

v1.0.0

Published

genertor-test

Downloads

4

Readme

vue-cli-plugin-tq-tpl

banner

配合 @vue/cli 3.0 通过插件快速生成前端项目模版.

注意事项:

  • 终端运行 vue config 查看 useTaobaoRegistrypackageManager 信息
    • useTaobaoRegistrytrue,则运行 vue config -s useTaobaoRegistry false 设置成 false
    • 查看 packageManager 值为 yarn 还是 npm,并分别执行下面两个步骤,切换镜像源
  • 若用 npm 安装依赖,则需将 npm 的镜像源设置成 http://223.4.69.11:4873/
    • 可安装 nrm 设置、切换镜像源
  • 若用 yarn 安装依赖,则需将 yarn 的镜像源设置成 http://223.4.69.11:4873/
    • 运行指令 yarn config set registry http://223.4.69.11:4873/

目录

使用

安装插件

$ vue add tq-tpl

安装依赖

$ npm install

vue add tq-tpl 后会默认执行了 npm install 进行依赖安装

分支说明

  • master 主分支
  • dev 开发分支
  • releate/addTemplate 新增后端管理模板分支(可删)
  • dev-second-phase v1.2.0升级分支
  • dev-mtpl 新增云图模板分支

指令

normal/screen

  • npm run serve 启动本地服务
  • npm run build 构建打包

framework

  • npm run serve 启动本地服务
  • npm run framework 构建打包基座项目

本地开发模式下,可以访问/dev路由,进入子应用本地联调模式

module

  • npm run serve 启动本地服务
  • npm run module 构建打包子应用项目
  • npm run dev:module 启动本联调模式

本地开发模式下,可以访问/dev路由,进入子应用本地联调模式

template-env

  • npm run serve 启动本地服务
  • npm run preview 构建打包模版项目

template-env 类型的项目推荐在push到仓库后带入构建好的资源,方便支持预览相关功能,因此该模式下的项目也不推荐做的厚重

其他

注入环境变量

 $ npm run [build/framework/module] -- --app_env='{"DNS_CODE": "test"}'

是否启用 external (默认为 true)

  $ npm run module -- --external=false

默认抽离配置项:

conf.externals({
  'vue-router': 'VueRouter',
  'vuex': 'Vuex',
  'vuex-persistedstate': 'VuexPersistedstate',
  'vuex-router-sync': 'VuexRouterSync',
  '@ourea/fetch': 'vFetch',
  ...EXTERNAL_OPTIONS,cd 
})

根据devServerproxy配置生成nginx.conf

 $ npm run build -- --port=8181 --root=/home/8181/mnt/dist

注意: v1.1.16 版本前的依赖, devServerproxy必填项

指令对应的环境变量

 $ npm run build // NODE_ENV: production
 $ npm run framework // NODE_ENV: framework
 $ npm run module // NODE_ENV: module

调试方式:

安装本地插件

版本更新说明

v1.1.16

  • dev:module指令新增端口检测功能,默认为3000,可同时启动多个子应用
  • 子应用中 baseUrl 端口号 3000 改成 控制台 输出可用的端口号。
    process.env.NODE_ENV === 'development' && http.setOption({
      conf: {
        baseUrl: 'http://localhost:3000/api',
      },
    })

v1.1.17

  • framework 模版 build 指令走自定义 build 指令

v1.2.0

  • 新增 husky lint-stagedgit commit 前校验 eslint
  • 修改 dev:module 的环境变量由 development 修改为 dev-module

Husky hooks skipped mac上使用sourceTree提交代码不会走husky自定义的钩子