diff --git a/.babelrc b/.babelrc index 6f01494b0..8d40400c0 100644 --- a/.babelrc +++ b/.babelrc @@ -1,11 +1,9 @@ { - "presets":[ - "react", - ["es2015", {"loose": true}] + "presets": [ + "@babel/preset-env", + "@babel/preset-react" ], "plugins": [ - "transform-object-assign", - "transform-object-rest-spread", - "transform-class-properties" + "@babel/plugin-proposal-class-properties" ] } diff --git a/.eslintrc b/.eslintrc index 55f6c1021..2d8316668 100644 --- a/.eslintrc +++ b/.eslintrc @@ -11,9 +11,6 @@ "react/display-name": 0, "no-console": 0 }, - "ecmaFeatures": { - "jsx": true - }, "env": { "node": true, "browser": true, diff --git a/.travis.yml b/.travis.yml index 6998e3244..4ed0ffaed 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,3 +1,5 @@ language: node_js + node_js: - - "stable" \ No newline at end of file + - "stable" + diff --git a/examples/__tests__/__snapshots__/CenterMode.test.js.snap b/examples/__tests__/__snapshots__/CenterMode.test.js.snap index 53ccd31eb..0ee911d16 100644 --- a/examples/__tests__/__snapshots__/CenterMode.test.js.snap +++ b/examples/__tests__/__snapshots__/CenterMode.test.js.snap @@ -5,7 +5,7 @@ exports[`CenterMode Tests Activity test 1`] = `

Center Mode

-
+
@@ -129,7 +129,7 @@ exports[`CenterMode Tests Counting test 1`] = `

Center Mode

-
+
@@ -253,7 +253,7 @@ exports[`CenterMode Tests Positioning test 1`] = `

Center Mode

-
+
diff --git a/examples/__tests__/__snapshots__/FocusOnSelect.test.js.snap b/examples/__tests__/__snapshots__/FocusOnSelect.test.js.snap index af4866025..e29379d22 100644 --- a/examples/__tests__/__snapshots__/FocusOnSelect.test.js.snap +++ b/examples/__tests__/__snapshots__/FocusOnSelect.test.js.snap @@ -6,7 +6,7 @@ exports[`FocusOnSelect Tests Activity Test 1`] = `
Click on any slide to select and make it current slide
-
+
@@ -124,7 +124,7 @@ exports[`FocusOnSelect Tests Activity Test 2`] = `
Click on any slide to select and make it current slide
-
+
diff --git a/examples/__tests__/__snapshots__/MultipleItems.test.js.snap b/examples/__tests__/__snapshots__/MultipleItems.test.js.snap index 882c1d1e3..e5b3d6477 100644 --- a/examples/__tests__/__snapshots__/MultipleItems.test.js.snap +++ b/examples/__tests__/__snapshots__/MultipleItems.test.js.snap @@ -5,7 +5,7 @@ exports[`Multiple Items should have 3 active slides 1`] = `

Multiple items

-
+
@@ -169,7 +169,7 @@ exports[`Multiple Items should have 3 dots 1`] = `

Multiple items

-
+
@@ -333,7 +333,7 @@ exports[`Multiple Items should have 9 actual slides and (3(pre) + 9(post)) clone

Multiple items

-
+
@@ -497,7 +497,7 @@ exports[`Multiple Items should show first 3 slides 1`] = `

Multiple items

-
+
@@ -661,7 +661,7 @@ exports[`Multiple Items should show last 3 slides when last dot is clicked 1`] =

Multiple items

-
+
@@ -825,7 +825,7 @@ exports[`Multiple Items should show last 3 slides when previous button is clicke

Multiple items

-
+
@@ -989,7 +989,7 @@ exports[`Multiple Items should show slides first 3 slides when middle dot is cli

Multiple items

-
+
@@ -1153,7 +1153,7 @@ exports[`Multiple Items should show slides from 4 to 6 when middle dot is clicke

Multiple items

-
+
@@ -1317,7 +1317,7 @@ exports[`Multiple Items should show slides from 4 to 6 when next button is click

Multiple items

-
+
diff --git a/examples/__tests__/__snapshots__/SimpleSlider.test.js.snap b/examples/__tests__/__snapshots__/SimpleSlider.test.js.snap index be1f3953f..be0907823 100644 --- a/examples/__tests__/__snapshots__/SimpleSlider.test.js.snap +++ b/examples/__tests__/__snapshots__/SimpleSlider.test.js.snap @@ -5,7 +5,7 @@ exports[`Simple Slider Snapshots click on 3rd dot 1`] = `

Single Item

-
+
@@ -116,7 +116,7 @@ exports[`Simple Slider Snapshots click on next button 1`] = `

Single Item

-
+
@@ -227,7 +227,7 @@ exports[`Simple Slider Snapshots click on prev button 1`] = `

Single Item

-
+
@@ -338,7 +338,7 @@ exports[`Simple Slider Snapshots slider initial state 1`] = `

Single Item

-
+
diff --git a/examples/__tests__/__snapshots__/UnevenSets.test.js.snap b/examples/__tests__/__snapshots__/UnevenSets.test.js.snap index e2b7fc194..1ec9b708a 100644 --- a/examples/__tests__/__snapshots__/UnevenSets.test.js.snap +++ b/examples/__tests__/__snapshots__/UnevenSets.test.js.snap @@ -5,7 +5,7 @@ exports[`UnevenSets Finite Activity test 1`] = `

Uneven sets (finite)

-
+
@@ -63,7 +63,7 @@ exports[`UnevenSets Finite Counting test 1`] = `

Uneven sets (finite)

-
+
@@ -121,7 +121,7 @@ exports[`UnevenSets Finite Positioning test 1`] = `

Uneven sets (finite)

-
+
@@ -179,7 +179,7 @@ exports[`UnevenSets Infinite Activity test 1`] = `

Uneven sets (infinite)

-
+
@@ -307,7 +307,7 @@ exports[`UnevenSets Infinite Counting test 1`] = `

Uneven sets (infinite)

-
+
@@ -435,7 +435,7 @@ exports[`UnevenSets Infinite Positioning test 1`] = `

Uneven sets (infinite)

-
+
diff --git a/gulpfile.js b/gulpfile.js index 16e93d96c..30ac0eabe 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -8,6 +8,8 @@ var WebpackDevServer = require("webpack-dev-server"); var assign = require("object-assign"); var opn = require("opn"); +var UglifyJsPlugin = require("uglifyjs-webpack-plugin"); + const DEV_PORT = 8080; gulp.task("clean", function() { @@ -54,7 +56,7 @@ gulp.task( gulp.task( "server", - gulp.series(["watch", "copy", "sass"], function(done) { + gulp.series(["watch", "copy", "sass"], function() { console.log("Start"); var myConfig = require("./webpack.config"); myConfig.plugins = myConfig.plugins.concat( @@ -68,8 +70,10 @@ gulp.task( new WebpackDevServer(webpack(myConfig), { contentBase: "./build", hot: true, - debug: true - }).listen(DEV_PORT, "0.0.0.0", function(err, result) { + stats: { + colors: true + } + }).listen(DEV_PORT, "localhost", function(err, result) { if (err) { console.log(err); } else { @@ -78,7 +82,6 @@ gulp.task( opn(server_url); } }); - done(); }) ); @@ -91,6 +94,7 @@ var distConfig = require("./webpack.config.dist.js"); gulp.task("dist-unmin", function(cb) { var unminConfig = assign({}, distConfig); unminConfig.output.filename = "react-slick.js"; + unminConfig.mode = "none"; return webpack(unminConfig, function(err, stat) { console.error(err); cb(); @@ -101,8 +105,11 @@ gulp.task("dist-min", function(cb) { var minConfig = assign({}, distConfig); minConfig.output.filename = "react-slick.min.js"; minConfig.plugins = minConfig.plugins.concat( - new webpack.optimize.UglifyJsPlugin({ - compressor: { + new UglifyJsPlugin({ + cache: true, + parallel: true, + sourceMap: true, + uglifyOptions: { warnings: false } }) diff --git a/package.json b/package.json index d3fdc2a43..437f88b4f 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "start": "gulp server", "build": "gulp clean && gulp sass && gulp copy && webpack", "prepublish": "babel ./src --out-dir ./lib && gulp dist", - "test": "eslint src && jest", + "test": "npm run lint && jest", "test:watch": "jest --watch", "lint": "eslint src", "gen": "node examples/scripts/generateExampleConfigs.js && node examples/scripts/generateExamples.js && xdg-open docs/jquery.html", @@ -32,25 +32,25 @@ "react-component" ], "devDependencies": { + "@babel/cli": "^7.0.0", + "@babel/core": "^7.1.2", + "@babel/plugin-proposal-class-properties": "^7.1.0", + "@babel/polyfill": "^7.0.0", + "@babel/preset-env": "^7.1.0", + "@babel/preset-react": "^7.0.0", "autoprefixer": "^7.1.2", - "babel-cli": "^6.16.0", - "babel-core": "^6.16.0", - "babel-eslint": "^7.0.0", - "babel-jest": "^19.0.0", - "babel-loader": "^6.2.5", - "babel-plugin-transform-class-properties": "^6.24.1", - "babel-plugin-transform-object-assign": "^6.8.0", - "babel-polyfill": "^6.16.0", + "babel-core": "^7.0.0-bridge.0", + "babel-eslint": "^9.0.0", + "babel-jest": "^23.4.2", + "babel-loader": "^8.0.4", "babel-preset-airbnb": "^2.1.1", - "babel-preset-es2015": "^6.16.0", - "babel-preset-react": "^6.16.0", "css-loader": "^0.28.0", "deepmerge": "^1.1.0", "del": "^2.2.2", "enzyme": "^3.2.0", "enzyme-adapter-react-16": "^1.1.0", "es5-shim": "^4.5.9", - "eslint": "^3.6.1", + "eslint": "^5.9.0", "eslint-plugin-import": "^2.9.0", "eslint-plugin-react": "^6.3.0", "express": "^4.14.0", @@ -59,7 +59,7 @@ "gulp-sass": "^4.0.0", "husky": "^0.14.3", "jasmine-core": "^2.5.2", - "jest": "^19.0.2", + "jest": "^23.6.0", "jquery": "^3.2.1", "js-beautify": "^1.7.5", "json-loader": "^0.5.4", @@ -76,8 +76,10 @@ "sinon": "^2.1.0", "slick-carousel": "^1.8.1", "style-loader": "^0.16.1", - "webpack": "^1.13.2", - "webpack-dev-server": "^1.16.1", + "uglifyjs-webpack-plugin": "^2.0.1", + "webpack": "^4.21.0", + "webpack-cli": "^3.1.2", + "webpack-dev-server": "^3.1.9", "why-did-you-update": "^0.1.1" }, "dependencies": { diff --git a/webpack.config.dist.js b/webpack.config.dist.js index 4d5e4a8b3..d5416d6f8 100644 --- a/webpack.config.dist.js +++ b/webpack.config.dist.js @@ -2,6 +2,8 @@ var webpack = require("webpack"); var path = require("path"); module.exports = { + mode: "production", + entry: "./src/index", output: { @@ -11,40 +13,45 @@ module.exports = { }, module: { - loaders: [ - { test: /\.jsx$/, loaders: ["babel"] }, - { test: /\.js$/, loaders: ["babel"], exclude: /node_modules/ } + rules: [ + { + test: /\.js/, + exclude: /(node_modules)/, + use: { + loader: "babel-loader" + } + } ] }, resolve: { - extensions: ["", ".js", ".jsx"] + extensions: [".js", ".jsx"] }, - externals: [ - { - react: { - root: "React", - commonjs2: "react", - commonjs: "react", - amd: "react" - }, - "react-dom": { - root: "ReactDOM", - commonjs2: "react-dom", - commonjs: "react-dom", - amd: "react-dom" - } + externals: { + react: { + root: "React", + commonjs2: "react", + commonjs: "react", + amd: "react" + }, + "react-dom": { + root: "ReactDOM", + commonjs2: "react-dom", + commonjs: "react-dom", + amd: "react-dom" } - ], + }, node: { Buffer: false }, - plugins: [ - new webpack.DefinePlugin({ - "process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV) - }) - ] + devtool: "source-map", + + performance: { + hints: "warning" + }, + + plugins: [] }; diff --git a/webpack.config.js b/webpack.config.js index 27ff9df4a..407721c63 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,41 +1,38 @@ var webpack = require("webpack"); var path = require("path"); -var autoprefixer = require("autoprefixer"); module.exports = { - devtool: "#inline-source-map", + mode: "production", + devtool: "source-map", entry: { - "docs.js": [ - "./docs/index.jsx" - // 'webpack/hot/only-dev-server', - // 'webpack-dev-server/client?http://localhost:8000' - ] + "docs.js": "./docs/index.jsx" }, output: { path: path.join(__dirname, "build"), filename: "[name]" }, module: { - loaders: [ - { test: /\.jsx$/, loaders: ["babel"] }, - { test: /\.js$/, loaders: ["babel"], exclude: /node_modules/ }, + rules: [ { - test: /\.scss$/, - loader: - "style!css!sass?outputStyle=expanded&" + - "includePaths[]=" + - path.resolve(__dirname, "./node_modules") + test: /\.jsx?/, + exclude: /(node_modules)/, + use: { + loader: "babel-loader" + } }, - { test: /\.md$/, loader: "html!markdown" } + { + test: /\.md$/, + loader: "html!markdown" + } ] }, - postcss: [autoprefixer({ browsers: ["last 2 version"] })], resolve: { - extensions: ["", ".js", ".jsx"] + extensions: [".js", ".jsx"] }, - plugins: [ - // new webpack.HotModuleReplacementPlugin(), - new webpack.NoErrorsPlugin(), - new webpack.IgnorePlugin(/vertx/) - ] + plugins: [new webpack.IgnorePlugin(/vertx/)], + devServer: { + contentBase: path.join(__dirname, "./build"), + port: 8080, + hot: true + } };