Js release plug zhen-chek (for detecting the data type) to the npm

Today think js itself is weakly typed, the type of data often need to detect the actual project. I intended to be a judge of js plug-in data types, to npm publish it.

The basic idea:

1, the input parameters, will return data type, all data following types

   '[object String]': 'string',
    "[object Boolean]": "boolean",
    "[object Number]": 'number',
    "[object Null]": 'null',
    "[object Undefined]": "undefined",
    "[object Array]": 'array',
    '[object Object]': 'object',
    '[object Set]': 'set',
    '[object Map]': 'map',
    '[object Symbol]':'symbol',
    '[object Function]':'function',
    '[object RegExp]':'regExp',
    '[object Window]': ' Window ' ,
     ' NaN ' : ' NaN '

Analyzing methods used: Object.prototype.toString.call ()

2, the use of webpack as engineering tools, webpack.config.js

var path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin'); //installed via npm
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

var config = {
    mode: 'development',
    entry: [
        path.resolve(__dirname, './src/example.js')
    ],
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '[name].js',
        libraryTarget: "umd",  //一套完整的规范 cmd  amd 
    },
    devServer: {
        contentBase: './dist'
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /(node_modules)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                }
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: 'index.html',
            inject: true
        })

    ],
    optimization: {
        minimize: true,

        minimizer: [
          new UglifyJsPlugin({
            test: /\.js(\?.*)?$/i,
          }),
        ],
      }
};

module.exports = config;

package.js

{
  "name": "zhen-check",
  "version": "1.4.0",
  "description": "check type of data ",
  "main": "src/index.js",  // 注意这里是index的路径不要写为index.js
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "webpack-dev-server --inline --progress --config webpack.config.js",
    "prod": "webpack --config webpack.config.js"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.4.5",
    "@babel/preset-env": "^7.4.5",
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.6",
    "babel-preset-env": "^1.7.0",
    "html-webpack-plugin": "^3.2.0",
    "uglifyjs-webpack-plugin": "^2.1.3",
    "webpack": "^4.35.0",
    "webpack-cli": "^3.3.5",
    "webpack-dev-server": "^3.7.2",
    "zhen-check": "^1.4.0"
  }
}

 

Then, using the account number and password to log in output npm adduser command-line tool, then use npm publish release.

This completes.

The development process there are a few caveats:

1, the reason can import by way of introduction, through the main package.js file access, so the back main export files to write plug-ins

2, webpack.config.js configuration file inside, output configuration

  Output: { 
        path: path.resolve (__ dirname, 'dist'), 
        filename: '[name] .js', 
        libraryTarget: "UMD", // a complete specification of AMD cmd 
    }

　In order to be able to introduce js a script, the above need

libraryTarget configured to umd.