maby-lib-cli
快速搭建 library 的基础环境.
Last updated a year ago by mabylove .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install maby-lib-cli 
SYNC missed versions from official npm registry.

maby-lib-cli

简介

用于快速搭建 library 的基础环境,使用 babel 进行编译, webpack 进行打包。

NPM

安装

npm i maby-lib-cli --save-dev

yarn add maby-lib-cli -D

使用

初始化项目

在安装项目时会默认执行一次初始化项目命令

>=v1.0.0 版本只初始化 package.json 下的执行命令, 安装完成后需手动执行 npm run init 初始化项目

maby-lib init

开发模式

maby-lib start

发布

maby-lib build

预览

maby-lib preview

package.json 中配置好各个启动命令即可

更多配置

支持多种方式定义配置文件

  • package.json 中可以自定义配置项目
{
  "name": "your lib",
  ...
  "mabycli": {
    "stylelint": true,
    "eslint": true,
    "dir": "publish", // 打包目录 @v2.0.2
    "deleteFile": true, // 只删除 `publish` 路径下的文件 @v2.0.2
    "vendors": [
      "react",
      "react-dom"
    ]
  }
}
  • mabycli.js 文件下自定义 mabycli 中的配置项

需在 package.json 中指明访问路径

{
  "name": "your lib",
  ...
  "mabycli": "./mabycli.js"
}
  • mabycli.js 文件下自定义 mabycli 中的配置项

需在 package.json 中指明访问路径

{
  "name": "your lib",
  ...
  "mabycli": "./mabycli.js"
}
  const path = require('path');

  // 使用一个函数时,将给函数传递内置的 plugins、loaders、resolve, 返回类型和 webpack 对应配置一样
  const getPlugins = (plugins) => {
    return plugins.push(new Plugin());
  }
  // 一个方法或者一个对象
  module.exports = () => ({
    stylelint: true, // 是否开启 stylelint
    openBrowser: true, // 是否启动时打开浏览器
    eslint: true, // 是否开启 eslint
    vendors: [ // 需要提取的公共库
      "react",
      "react-dom"
    ],
    devServerOptions: { // webpack-dev-server 的配置项
      contentBase: path.join(process.cwd(), 'dist'),
      overlay: true,
      headers: {
        'access-control-allow-origin': '*',
      },
      open: true,
      port: 3300,
      stats: {
        modules: false,
        colors: true
      }
    },
    // v 2.0.0 新增功能
    plugins: [new Plugin()] || getPlugins, // webpack的 plugins 配置
    loaders: [{...some loaders}] || getLoaders, // webpack的 loaders 配置
    resolve: ['.js', '.jsx', '.json'] || getResolve, // webpack的 resolve 配置
  });
  • .mabycli 文件下自定义 mabycli 中的配置项
{
  "primary-color": "#fa8c16",
  "stylelint": true,
  "eslint": true,
  "vendors": [
    "react",
    "react-dom"
  ]
}
  • 配置 antd 主题样式

package.json

{
  "name": "your lib",
  ...
  "dependencies": {
    "antd": "^3.11.0"
  },
  "mabycli": "./mabycli.js",
  "theme": {
    "primary-color": "#fa541c" // 设置主题样式
  }
}

.babelrc

{
  "plugins": [
    [
      "import",
      {
        "libraryName": "antd",
        "libraryDirectory": "es",
        "style": true
      }
    ]
  ]
}

mabycli.js

const path = require('path');
const fs = require('fs');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

const getTheme = () => {
  let theme = {};
  // 获取主题颜色
  const pkgPath = path.resolve(__dirname, './package.json');
  const pkg = fs.existsSync(pkgPath) ? require(pkgPath) : {};
  if (pkg.theme && typeof pkg.theme === 'string') {
    let cfgPath = pkg.theme;
    // relative path
    if (cfgPath.charAt(0) === '.') {
      cfgPath = path.resolve(__dirname, cfgPath);
    }
    const getThemeConfig = require(cfgPath);
    theme = getThemeConfig();
  } else if (pkg.theme && typeof pkg.theme === 'object') {
    theme = pkg.theme;
  }
  return theme;
};

const getLoaders = (loaders) => {
  const theme = getTheme();
  if (!theme) {
    return loaders;
  }
  // 利用 modifyVars 修改主题样式
  const themeLoaders = {
    test: /\.less$/,
    include: /node_modules/,
    use: ExtractTextPlugin.extract({
      fallback: 'style-loader',
      use: [
        'css-loader', 'postcss-loader',
        {
          loader: 'less-loader',
          options: {
            javascriptEnabled: true,
            modifyVars: theme
          }
        }
      ]
    })
  };
  // 修改内部loader 的 exclude
  loaders.forEach(loader => {
    const isLess = RegExp(loader.test).test('.less');
    if (isLess) {
      loader.exclude = /node_modules/;
    }
  });
  loaders.push(themeLoaders);
  return loaders;
};

// 修改 ExtractText, 修改antd主题样式时,需要设置 allChunks: true
const getExtractTextPlugin = (ExtractText) => {
  return {
    filename: ExtractText.filename,
    allChunks: true,
  };
};
module.exports = () => ({
  stylelint: true,
  port: 10056,
  loaders: getLoaders,
  extractTextPlugin: getExtractTextPlugin
});

版本变化信息查看

发布日志

目录结构

  ├─ dist                   压缩文件 library.[version].min.js/library.[version].min.css
  ├─ example                预览环境
  |  ├─ example.js          library 测试区
  |  ├─ index.js            开发模式入口
  ├─ lib                    生产环境库
  ├─ src                    开发环境
  |  ├─ components
  |  |  ├─ style
  |  |  ├─ index.js
  |  ├─ style
  |  ├─ index.js
  ├─ .babelrc
  ├─ .eslintignore
  ├─ .gitignore
  ├─ .eslintrc              eslint配置文件夹
  ├─ postcss.config.js      postcss配置文件夹
  ├─ README.md

Current Tags

  • 2.0.2                                ...           latest (a year ago)

28 Versions

  • 2.0.2                                ...           a year ago
  • 2.0.1                                ...           a year ago
  • 2.0.0                                ...           a year ago
  • 1.1.1                                ...           a year ago
  • 1.1.0                                ...           a year ago
  • 1.0.0                                ...           a year ago
  • 0.0.2                                ...           a year ago
  • 0.0.2-beta.7                                ...           a year ago
  • 0.0.2-beta.6                                ...           a year ago
  • 0.0.2-beta.5                                ...           a year ago
  • 0.0.2-beta.4                                ...           a year ago
  • 0.0.2-beta.3                                ...           a year ago
  • 0.0.2-beta.2                                ...           a year ago
  • 0.0.2-beta.1                                ...           a year ago
  • 0.0.1                                ...           a year ago
  • 0.0.1-beta.23                                ...           a year ago
  • 0.0.1-beta.22                                ...           a year ago
  • 0.0.1-beta.21                                ...           a year ago
  • 0.0.1-beta.20                                ...           a year ago
  • 0.0.1-beta.19                                ...           a year ago
  • 0.0.1-beta.18                                ...           a year ago
  • 0.0.1-beta.17                                ...           a year ago
  • 0.0.1-beta.16                                ...           a year ago
  • 0.0.1-beta.15                                ...           a year ago
  • 0.0.1-beta.14                                ...           a year ago
  • 0.0.1-beta.13                                ...           a year ago
  • 0.0.1-beta.12                                ...           a year ago
  • 0.0.1-beta.10                                ...           a year ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dev Dependencies (9)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |