fix stylelint compilation failure, bump to webpack 5

Signed-off-by: Julien Veyssier <eneiluj@posteo.net>

package.json

@@ -7,13 +7,13 @@
     "test": "tests"
   },
   "scripts": {
-    "build": "NODE_ENV=production webpack --progress --hide-modules --config webpack.js",
+    "build": "NODE_ENV=production webpack --progress --config webpack.js",
     "dev": "NODE_ENV=development webpack --progress --config webpack.js",
     "watch": "NODE_ENV=development webpack --progress --watch --config webpack.js",
     "lint": "eslint --ext .js,.vue src",
     "lint:fix": "eslint --ext .js,.vue src --fix",
-    "stylelint": "stylelint **/*.css **/*.scss **/*.vue",
+    "stylelint": "stylelint src",
-    "stylelint:fix": "stylelint **/*.css **/*.scss **/*.vue --fix"
+    "stylelint:fix": "stylelint src --fix"
   },
   "repository": {
     "type": "git",
@@ -35,7 +35,6 @@
     "@nextcloud/router": "^1.1.0",
     "@nextcloud/auth": "^1.3.0",
     "@nextcloud/vue": "^2.7.0",
-    "@nextcloud/webpack-vue-config": "^1.4.0",
     "@nextcloud/vue-dashboard": "^1.0.1",
     "@nextcloud/axios": "^1.3.3",
     "@nextcloud/dialogs": "^1.4.0",
@@ -48,35 +47,37 @@
     "vue-click-outside": "^1.1.0"
   },
   "devDependencies": {
+    "@babel/core": "^7.11.6",
+    "@babel/plugin-proposal-object-rest-spread": "^7.11.0",
+    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
+    "@babel/preset-env": "^7.11.5",
+    "@nextcloud/browserslist-config": "^1.0.0",
     "@nextcloud/eslint-config": "^2.2.0",
-    "@nextcloud/eslint-plugin": "^1.4.0",
+    "@nextcloud/eslint-plugin": "^1.5.0",
-    "stylelint-webpack-plugin": "^2.1.0",
+    "@nextcloud/webpack-vue-config": "^1.4.1",
-    "stylelint": "^13.6.1",
-    "webpack-merge": "^5.1.1",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.1.0",
-    "css-loader": "^4.2.2",
+    "css-loader": "^3.6.0",
     "eslint": "^6.8.0",
     "eslint-config-standard": "^14.1.1",
-    "eslint-import-resolver-webpack": "^0.12.2",
     "eslint-loader": "^4.0.2",
-    "eslint-plugin-import": "^2.22.0",
+    "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-promise": "^4.2.1",
     "eslint-plugin-standard": "^4.0.1",
     "eslint-plugin-vue": "^6.2.2",
-    "@babel/core": "^7.10.5",
+    "file-loader": "^6.1.1",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/preset-env": "^7.10.4",
-    "vue-loader": "^15.9.1",
-    "vue-template-compiler": "^2.6.10",
     "node-sass": "^4.14.1",
     "sass-loader": "^8.0.2",
-    "style-loader": "^1.2.1",
+    "stylelint": "^13.7.2",
-    "url-loader": "^4.1.0",
+    "stylelint-config-recommended-scss": "^4.2.0",
-    "@nextcloud/browserslist-config": "^1.0.0",
+    "stylelint-scss": "^3.18.0",
-    "clean-webpack-plugin": "^3.0.0",
+    "stylelint-webpack-plugin": "^2.1.0",
-    "webpack": "^4.43.0",
+    "url-loader": "^4.1.1",
-    "webpack-cli": "^3.3.12"
+    "vue-loader": "^15.9.3",
+    "vue-template-compiler": "^2.6.12",
+    "webpack": "^5.1.0",
+    "webpack-cli": "^4.0.0",
+    "webpack-node-externals": "^2.5.2"
   }
 }

src/components/PersonalSettings.vue

@@ -228,12 +228,15 @@ export default {
 #moodle-search-block {
 	margin-top: 30px;
 }
+
 .moodle-grid-form label {
 	line-height: 38px;
 }
+
 .moodle-grid-form input {
 	width: 100%;
 }
+
 .moodle-grid-form {
 	max-width: 600px;
 	display: grid;
@@ -242,26 +245,33 @@ export default {
 		margin-bottom: -1px;
 	}
 }
+
 #moodle_prefs .icon {
 	display: inline-block;
 	width: 32px;
 }
+
 #moodle_prefs .grid-form .icon {
 	margin-bottom: -3px;
 }
+
 .icon-moodle {
 	background-image: url(./../../img/app-dark.svg);
 	background-size: 23px 23px;
 	height: 23px;
 	margin-bottom: -4px;
 }
+
 body.theme--dark .icon-moodle {
 	background-image: url(./../../img/app.svg);
 }
+
 #moodle-content {
 	margin-left: 40px;
 }
+
 #moodle-search-block .icon {
 	width: 22px;
 }
+
 </style>

stylelint.config.js

@@ -0,0 +1,32 @@
+module.exports = {
+	extends: 'stylelint-config-recommended-scss',
+	rules: {
+		indentation: 'tab',
+		'selector-type-no-unknown': null,
+		'number-leading-zero': null,
+		'rule-empty-line-before': [
+			'always',
+			{
+				ignore: ['after-comment', 'inside-block'],
+			},
+		],
+		'declaration-empty-line-before': [
+			'never',
+			{
+				ignore: ['after-declaration'],
+			},
+		],
+		'comment-empty-line-before': null,
+		'selector-type-case': null,
+		'selector-list-comma-newline-after': null,
+		'no-descending-specificity': null,
+		'string-quotes': 'single',
+		'selector-pseudo-element-no-unknown': [
+			true,
+			{
+				ignorePseudoElements: ['v-deep'],
+			},
+		],
+	},
+	plugins: ['stylelint-scss'],
+}

webpack.js

@@ -1,17 +1,13 @@
-const { merge } = require('webpack-merge')
 const path = require('path')
-const webpack = require('webpack')
 const webpackConfig = require('@nextcloud/webpack-vue-config')
 
-if (webpackConfig.entry && webpackConfig.entry.main) {
+const buildMode = process.env.NODE_ENV
-	delete webpackConfig.entry.main
+const isDev = buildMode === 'development'
+webpackConfig.devtool = isDev ? 'cheap-source-map' : 'source-map'
+
+webpackConfig.entry = {
+    personalSettings: { import: path.join(__dirname, 'src', 'personalSettings.js'), filename: 'integration_moodle-personalSettings.js' },
+    dashboard: { import: path.join(__dirname, 'src', 'dashboard.js'), filename: 'integration_moodle-dashboard.js' },
 }
 
-const config = {
+module.exports = webpackConfig
-	entry: {
-		personalSettings: path.join(__dirname, 'src', 'personalSettings.js'),
-		dashboard: path.join(__dirname, 'src', 'dashboard.js'),
-	},
-}
-
-module.exports = merge(config, webpackConfig)