@afp/toolkit-styles - npm Package Compare versions

Comparing version 1.3.3 to 2.0.0

package.json

 {
   "name": "@afp/toolkit-styles",
-  "version": "1.3.3",
+  "version": "2.0.0",
   "description": "",
   "main": "dist/main.bundle.css",
   "scripts": {
-    "dev": "webpack --watch",
-    "build": "webpack -p",
-    "prepublishOnly": "npm run build",
+    "dev": "webpack-serve --mode development --open",
+    "build": "webpack --mode production",
     "test": "echo \"Error: no test specified\" && exit 1"
@@ -14,22 +13,27 @@ },
   "license": "ISC",
-  "browserslist": "last 3 versions",
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not ie <= 8"
+  ],
   "devDependencies": {
-    "autoprefixer": "^7.2.4",
-    "css-loader": "^0.28.8",
-    "cssnano": "^3.10.0",
-    "extract-text-webpack-plugin": "^3.0.2",
-    "file-loader": "^1.1.6",
-    "node-sass": "^4.7.2",
-    "postcss-import": "^11.0.0",
-    "postcss-scss": "^1.0.3",
-    "sass-loader": "^6.0.6",
-    "style-loader": "^0.19.1",
-    "url-loader": "^0.6.2",
-    "webpack": "^3.10.0"
-  },
-  "dependencies": {
-    "clean-webpack-plugin": "^0.1.17",
-    "normalize.css": "^7.0.0",
-    "postcss-loader": "^2.0.10"
+    "autoprefixer": "^8.6.4",
+    "clean-webpack-plugin": "^0.1.19",
+    "css-loader": "^0.28.11",
+    "file-loader": "^1.1.11",
+    "html-webpack-plugin": "^3.2.0",
+    "mini-css-extract-plugin": "^0.4.0",
+    "node-sass": "^4.9.0",
+    "normalize.css": "^8.0.0",
+    "optimize-css-assets-webpack-plugin": "^4.0.3",
+    "postcss-import": "^11.1.0",
+    "postcss-loader": "^2.1.5",
+    "postcss-scss": "^1.0.6",
+    "sass-loader": "^7.0.3",
+    "url-loader": "^1.0.1",
+    "webpack": "^4.12.1",
+    "webpack-cli": "^3.0.8",
+    "webpack-hot-client": "^4.0.3",
+    "webpack-serve": "^1.0.4"
   }
 }

Readme.md

@@ -9,7 +9,20 @@ # Toolkit-styles
 
-Then in your entry js  
+Then in your entry js : 
+
 ```
-import '@afp/toolkit-styles/dist/index.bundle.css'
+import '@afp/toolkit-styles'
 ```
 
+or in Sass : 
+
+```
+@import url('~@afp/toolkit-styles');
+```
+
+If you need the variables in Sass : 
+
+```
+@import "~@afp/toolkit-styles/src/scss/variables.scss";
+```
+
 # Requirements
@@ -21,3 +34,4 @@
 
-Just `npm run dev`, then open `/index.html` (yes, just double-click) with your browser. Feel free to modify this file to add new markup, and to modify styles in the scss folder.
+Just `npm install` then `npm run dev` and the page will open in your browser.
+Feel free to modify this file to add new markup, and to modify styles in the scss folder.
 
@@ -30,3 +44,3 @@ Node watch these files and automatically rebuild the CSS styles in dist/ folder.
 
-Not very necessary, but you can build without watch with `npm run build`. Then you can publish your module with `npm publish`.
+`npm run build`, then you can publish your module with `npm publish`.
 
@@ -33,0 +47,0 @@ # Contributing

webpack.config.js

@@ -1,12 +0,11 @@
-const path = require('path');
-const webpack = require('webpack');
-const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const { resolve } = require('path');
 const CleanWebpackPlugin = require('clean-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
 
 module.exports = {
-  entry: ['./scss/index.scss'],
-  output: {
-    filename: 'index.bundle.css',
-    path: path.resolve(__dirname, 'dist')
-  },
+  mode: process.env.WEBPACK_SERVE ? 'development' : 'production',
+  target: 'web',
+  entry: resolve(__dirname, 'src', 'index.js'),
   module: {
@@ -16,11 +15,16 @@ rules: [
         test: /\.css$/,
-        use: ExtractTextPlugin.extract({
-          use: ['css-loader', 'postcss-loader']
-        })
+        use: [
+          MiniCssExtractPlugin.loader,
+          'css-loader',
+          'postcss-loader'
+        ]
       },
       {
         test: /\.scss$/,
-        use: ExtractTextPlugin.extract({
-          use: ['css-loader', 'postcss-loader', 'sass-loader']
-        })
+        use: [
+          MiniCssExtractPlugin.loader,
+          'css-loader',
+          'postcss-loader',
+          'sass-loader'
+        ]
       },
@@ -41,9 +45,20 @@ {
   },
+  optimization: {
+    minimizer: [
+      new OptimizeCSSAssetsPlugin()
+    ]
+  },
   plugins: [
-    new CleanWebpackPlugin('dist'),
-    new ExtractTextPlugin({
-      filename: 'index.bundle.css',
-      allChunks: true
+    new CleanWebpackPlugin(resolve(__dirname, 'dist')),
+    new MiniCssExtractPlugin({
+      filename: '[name].bundle.css'
+    }),
+    new HtmlWebpackPlugin({
+      template: resolve(__dirname, 'index.html')
     })
-  ]
-}
+  ],
+  serve: {
+    content: resolve(__dirname, 'dist'),
+    hot: true
+  }
+}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 34 instances in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 32 instances in 1 package

Improved metrics

Total package byte prevSize

2018661

increased by7.43%

Dependency count

0

decreased by-100%

Number of package files

67

increased by8.06%

Lines of code

167

increased by227.45%

Number of lines in readme file

52

increased by36.84%

Worsened metrics

Dev dependency count

18

increased by50%

Number of low supply chain risk alerts

2

increased by100%

Number of medium supply chain risk alerts

47

increased by6.82%

Dependency changes

• - Removedclean-webpack-plugin@^0.1.17

• - Removednormalize.css@^7.0.0

• - Removedpostcss-loader@^2.0.10

• - Removedajv@6.12.6(transitive)

• - Removedajv-keywords@3.5.2(transitive)

• - Removedansi-styles@3.2.1(transitive)

• - Removedargparse@1.0.10(transitive)

• - Removedbalanced-match@1.0.2(transitive)

• - Removedbig.js@5.2.2(transitive)

• - Removedbrace-expansion@1.1.11(transitive)

• - Removedcaller-callsite@2.0.0(transitive)

• - Removedcaller-path@2.0.0(transitive)

• - Removedcallsites@2.0.0(transitive)

• - Removedchalk@2.4.2(transitive)

• - Removedclean-webpack-plugin@0.1.19(transitive)

• - Removedcolor-convert@1.9.3(transitive)

• - Removedcolor-name@1.1.3(transitive)

• - Removedconcat-map@0.0.1(transitive)

• - Removedcosmiconfig@5.2.1(transitive)

• - Removedemojis-list@3.0.0(transitive)

• - Removederror-ex@1.3.2(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)

• - Removedesprima@4.0.1(transitive)

• - Removedfast-deep-equal@3.1.3(transitive)

• - Removedfast-json-stable-stringify@2.1.0(transitive)

• - Removedfs.realpath@1.0.0(transitive)

• - Removedglob@7.2.3(transitive)

• - Removedhas-flag@3.0.0(transitive)

• - Removedimport-cwd@2.1.0(transitive)

• - Removedimport-fresh@2.0.0(transitive)

• - Removedimport-from@2.1.0(transitive)

• - Removedinflight@1.0.6(transitive)

• - Removedinherits@2.0.4(transitive)

• - Removedis-arrayish@0.2.1(transitive)

• - Removedis-directory@0.3.1(transitive)

• - Removedjs-yaml@3.14.1(transitive)

• - Removedjson-parse-better-errors@1.0.2(transitive)

• - Removedjson-schema-traverse@0.4.1(transitive)

• - Removedjson5@1.0.2(transitive)

• - Removedloader-utils@1.4.2(transitive)

• - Removedminimatch@3.1.2(transitive)

• - Removedminimist@1.2.8(transitive)

• - Removednormalize.css@7.0.0(transitive)

• - Removedonce@1.4.0(transitive)

• - Removedparse-json@4.0.0(transitive)

• - Removedpath-is-absolute@1.0.1(transitive)

• - Removedpostcss@6.0.23(transitive)

• - Removedpostcss-load-config@2.1.2(transitive)

• - Removedpostcss-loader@2.1.6(transitive)

• - Removedpunycode@2.3.1(transitive)

• - Removedresolve-from@3.0.0(transitive)

• - Removedrimraf@2.7.1(transitive)

• - Removedschema-utils@0.4.7(transitive)

• - Removedsource-map@0.6.1(transitive)

• - Removedsprintf-js@1.0.3(transitive)

• - Removedsupports-color@5.5.0(transitive)

• - Removeduri-js@4.4.1(transitive)

• - Removedwrappy@1.0.2(transitive)