From 61524cb8d99800a996fa0ad6567dd6105d79a79b Mon Sep 17 00:00:00 2001 From: Frank Date: Wed, 24 Mar 2021 23:18:21 +0000 Subject: [PATCH] feat: Initial Release --- .github/workflows/automation.yml | 27 ++++---- package.json | 55 ++++++++++----- src/{CoCreate-croppie.js => index.js} | 0 webpack.config.js | 98 +++++++++++++++++---------- 4 files changed, 111 insertions(+), 69 deletions(-) rename src/{CoCreate-croppie.js => index.js} (100%) diff --git a/.github/workflows/automation.yml b/.github/workflows/automation.yml index 310531a..cc49039 100644 --- a/.github/workflows/automation.yml +++ b/.github/workflows/automation.yml @@ -3,28 +3,28 @@ name: CI on: push: branches: - - master + - master pull_request: branches: - - master + - master create: branches: - - master + - master jobs: - updateKeyword: + about: runs-on: ubuntu-latest steps: - name: Checkout uses: actions/checkout@v2 - + - name: Jaid/action-sync-node-meta uses: jaid/action-sync-node-meta@v1.4.0 with: direction: overwrite-github # default is overwrite-file githubToken: ${{ secrets.GITHUB }} - - ci: + + release: runs-on: ubuntu-latest steps: - name: Checkout @@ -41,27 +41,26 @@ jobs: @semantic-release/github env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} - NPM_TOKEN: ${{ secrets.NPM_TOKEN }} # Auto Changog generator - + NPM_TOKEN: ${{ secrets.NPM_TOKEN }} # Auto Changog generator + docs: runs-on: ubuntu-latest steps: - name: Checkout uses: actions/checkout@v2 - + - name: update documentation uses: CoCreate-app/CoCreate-docs@master - - + cdn: runs-on: ubuntu-latest steps: - name: Checkout uses: actions/checkout@v2 - + - name: upload cdn uses: CoCreate-app/CoCreate-s3@master with: aws-key-id: ${{ secrets.AWSACCESSKEYID }} aws-access-key: ${{ secrets.AWSSECERTACCESSKEY }} - source: './dist/CoCreate-croppie.min.js' \ No newline at end of file + source: "./dist/CoCreate-croppie.min.js" diff --git a/package.json b/package.json index 387b5bd..5c9a552 100644 --- a/package.json +++ b/package.json @@ -2,13 +2,29 @@ "name": "@cocreate/croppie", "version": "1.0.0", "description": "A simple croppie component in vanilla javascript. Easily configured using HTML5 data-attributes and/or JavaScript API.", - "keywords": ["croppie","cocreate","low-code-framework","no-code-framework","cocreatejs","cocreatejs-component","cocreate-framework","no-code","low-code","collaborative-framework","realtime","realtime-framework","collaboration","shared-editing","html5-framework","javascript-framework"], - "publishConfig": { - "access": "public" - }, + "keywords": [ + "croppie", + "cocreate", + "low-code-framework", + "no-code-framework", + "cocreatejs", + "cocreatejs-component", + "cocreate-framework", + "no-code", + "low-code", + "collaborative-framework", + "realtime", + "realtime-framework", + "collaboration", + "shared-editing", + "html5-framework", + "javascript-framework" + ], + "publishConfig": { "access": "public" }, "scripts": { - "start": "npx webpack --config webpack.config.js --watch", + "start": "npx webpack --config webpack.config.js", "build": "NODE_ENV=production npx webpack --config webpack.config.js", + "dev": "npx webpack --config webpack.config.js --watch", "docs": "node ./node_modules/@cocreate/docs/src/index.js" }, "repository": { @@ -17,23 +33,26 @@ }, "author": "CoCreate LLC", "license": "MIT", - "bugs": { - "url": "https://github.com/CoCreate-app/CoCreate-croppie/issues" - }, + "bugs": { "url": "https://github.com/CoCreate-app/CoCreate-croppie/issues" }, "homepage": "https://cocreate.app/docs/croppie", + "funding": { + "type": "GitHub Sponsors ❤", + "url": "https://github.com/sponsors/CoCreate-app" + }, + "main": "./src/index.js", "devDependencies": { - "@babel/core": "^7.12.10", - "@babel/preset-env": "^7.12.11", - "babel-loader": "^8.2.2", + "@babel/core": "^7.9.6", + "@babel/preset-env": "^7.9.6", + "babel-loader": "^8.1.0", "clean-webpack-plugin": "^3.0.0", "html-webpack-plugin": "^4.5.0", "uglifyjs-webpack-plugin": "^2.2.0", - "webpack": "^5.14.0", - "webpack-cli": "^4.3.1", - "webpack-log": "^3.0.1" + "webpack": "^5.24.4", + "webpack-cli": "^4.5.0", + "webpack-log": "^3.0.1", + "file-loader": "^6.2.0", + "style-loader": "^2.0.0", + "terser-webpack-plugin": "^5.1.1" }, - - "dependencies": { - "@cocreate/docs": "^1.0.3" - } + "dependencies": { "@cocreate/docs": "^1.0.3" } } diff --git a/src/CoCreate-croppie.js b/src/index.js similarity index 100% rename from src/CoCreate-croppie.js rename to src/index.js diff --git a/webpack.config.js b/webpack.config.js index c4cc8f5..937083d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,61 +1,85 @@ -// Webpack uses this to work with directories -const path = require('path'); -const UglifyJsPlugin = require('uglifyjs-webpack-plugin'); -// const HtmlWebpackPlugin = require('html-webpack-plugin'); -// const { CleanWebpackPlugin } = require('clean-webpack-plugin'); +const path = require("path") +const TerserPlugin = require("terser-webpack-plugin") +const MiniCssExtractPlugin = require("mini-css-extract-plugin") +let isProduction = process.env.NODE_ENV === "production" +const { CleanWebpackPlugin } = require("clean-webpack-plugin") -let isProduction = process.env.NODE_ENV === 'production'; - -// This is main configuration object. -// Here you write different options and tell Webpack what to do module.exports = { - - // Path to your entry point. From this file Webpack will begin his work entry: { - 'CoCreate-croppie': './src/CoCreate-croppie.js', + "CoCreate-croppie": "./src/index.js", }, - - // Path and filename of your result bundle. - // Webpack will bundle all JavaScript into this file output: { - path: path.resolve(__dirname, 'dist'), - filename: isProduction ? '[name].min.js' : '[name].js', - libraryTarget: 'umd', - libraryExport: 'default', - library: ['CoCreate', 'croppie'], + path: path.resolve(__dirname, "dist"), + filename: isProduction ? "[name].min.js" : "[name].js", + libraryTarget: "umd", + libraryExport: "default", + library: ["CoCreate", "croppie"], globalObject: "this", + // publicPath: 'https://server.cocreate.app/CoCreateJS/dist/' }, + plugins: [ + new CleanWebpackPlugin(), + new MiniCssExtractPlugin({ + filename: "[name].css", + }), + ], // Default mode for Webpack is production. // Depending on mode Webpack will apply different things // on final bundle. For now we don't need production's JavaScript // minifying and other thing so let's set mode to development - mode: isProduction ? 'production' : 'development', + mode: isProduction ? "production" : "development", module: { - rules: [{ - test: /\.js$/, + rules: [ + { + test: /.js$/, exclude: /(node_modules)/, use: { - loader: 'babel-loader', + loader: "babel-loader", options: { - presets: ['@babel/preset-env'] - } - } + plugins: ["@babel/plugin-transform-modules-commonjs"], + }, + }, }, - ] + { + test: /.css$/i, + use: [ + { loader: "style-loader", options: { injectType: "linkTag" } }, + "file-loader", + ], + }, + ], }, // add source map - ...(isProduction ? {} : { devtool: 'eval-source-map' }), + ...(isProduction ? {} : { devtool: "eval-source-map" }), - // add uglifyJs optimization: { - minimizer: [new UglifyJsPlugin({ - uglifyOptions: { - // get options: https://github.com/mishoo/UglifyJS - drop_console: isProduction + minimize: true, + minimizer: [ + new TerserPlugin({ + extractComments: true, + // cache: true, + parallel: true, + // sourceMap: true, // Must be set to true if using source-maps in production + terserOptions: { + // https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions + // extractComments: 'all', + compress: { + drop_console: true, + }, + }, + }), + ], + splitChunks: { + chunks: "all", + minSize: 200, + // maxSize: 99999, + //minChunks: 1, + + cacheGroups: { + defaultVendors: false, }, - })], + }, }, - -}; +}