Minor cleanup of webpack

Author: euvl

.circleci/config.yml

@@ -1,18 +1,34 @@
 module.exports = {
   root: true,
-  extends: 'standard',
-  plugins: [
-    'html'
+
+  env: {
+    node: true
+  },
+
+  extends: [
+    'plugin:vue/essential',
+    'eslint:recommended',
+    '@vue/prettier',
   ],
-  'rules': {
-    'no-multi-spaces': [
-      'error', {
-        exceptions: {
-          'ImportDeclaration': true
-        }
+
+  parserOptions: {
+    ecmaVersion: 2020
+  },
+
+  rules: {
+    'no-console': 'off',
+    'no-debugger': 'off'
+  },
+
+  overrides: [
+    {
+      files: [
+        '**/*.spec.{j,t}s?(x)',
+      //  '**/tests/unit/**/*.spec.{j,t}s?(x)'
+      ],
+      env: {
+        jest: true
       }
-    ],
-    'arrow-parens': 0,
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
-  }
+    }
+  ],
 }

.eslintrc.js

@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "semi": false,
+  "trailingComma": "none"
+}

.prettierrc

@@ -1,9 +1,8 @@
 module.exports = function(babel) {
-  babel.cache(true);
+  babel.cache(true)
 
   return {
-    presets: ["@babel/preset-env"],
-    comments: false,
-    plugins: ["@babel/plugin-proposal-object-rest-spread"]
-  };
-};
+    presets: ['@babel/preset-env'],
+    plugins: ['@babel/plugin-proposal-object-rest-spread']
+  }
+}

babel.config.js

@@ -1,6 +1,6 @@
 const path = require('path')
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
-const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin")
+const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
 const { VueLoaderPlugin } = require('vue-loader')
 
 module.exports = {
@@ -10,15 +10,20 @@ module.exports = {
     library: 'vue-js-modal',
     libraryTarget: 'umd',
     path: path.resolve(__dirname, '../dist'),
-    publicPath: '/dist/',
+    publicPath: '/dist/'
+  },
+  resolve: {
+    extensions: ['.ts', '.js']
   },
   optimization: {
     minimizer: [
       new UglifyJsPlugin({
         cache: true,
         parallel: true
       }),
-      new OptimizeCSSAssetsPlugin({})
+      new OptimizeCSSAssetsPlugin({
+        canPrint: true
+      })
     ]
   },
   module: {
@@ -32,16 +37,19 @@ module.exports = {
         loader: 'babel-loader',
         exclude: /node_modules/
       },
+      {
+        test: /\.ts$/,
+        loader: 'ts-loader',
+        exclude: /node_modules/,
+        options: {
+          appendTsSuffixTo: [/\.vue$/]
+        }
+      },
       {
         test: /\.css$/,
-        use: [
-          'vue-style-loader',
-          'css-loader'
-        ]
+        use: ['vue-style-loader', 'css-loader']
       }
     ]
   },
-  plugins: [
-    new VueLoaderPlugin()
-  ]
+  plugins: [new VueLoaderPlugin()]
 }

build/webpack.base.config.js

@@ -1,6 +1,6 @@
 const path = require('path')
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
-const MiniCssExtractPlugin = require("mini-css-extract-plugin")
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const VueLoaderPlugin = require('vue-loader/lib/plugin')
 
 module.exports = {
@@ -26,7 +26,7 @@ module.exports = {
     rules: [
       {
         test: /\.vue$/,
-        loader: 'vue-loader',
+        loader: 'vue-loader'
       },
       {
         test: /\.js$/,
@@ -35,17 +35,14 @@ module.exports = {
       },
       {
         test: /\.css$/,
-        use: [
-          MiniCssExtractPlugin.loader,
-          'css-loader'
-        ]
+        use: [MiniCssExtractPlugin.loader, 'css-loader']
       }
     ]
   },
   plugins: [
     new VueLoaderPlugin(),
     new MiniCssExtractPlugin({
-      filename: "styles.css",
+      filename: 'styles.css'
     })
   ]
 }