Настройки webpack

build/webpack.base.config.js

@@ -15,17 +15,9 @@ module.exports = {
             // это будет применяться к файлам `.js`
             // А ТАКЖЕ к секциям `<script>` внутри файлов `.vue`
             {
-            test: /\.js$/,
+                test: /\.js$/,
-            loader: 'babel-loader'
+                loader: 'babel-loader',
-            },
+                exclude: /node_modules/
-            // это будет применяться к файлам `.css`
-            // А ТАКЖЕ к секциям `<style>` внутри файлов `.vue`
-            {
-            test: /\.css$/,
-            use: [
-              'vue-style-loader',
-              'css-loader'
-            ]
             },
             {
                 test: /\.gif$/,

build/webpack.dev.config.js

@@ -15,7 +15,16 @@ module.exports = merge(baseWpConfig, {
             {
                 test: /\.vue$/,
                 loader: "vue-loader"
-            }
+            },
+            // это будет применяться к файлам `.css`
+            // А ТАКЖЕ к секциям `<style>` внутри файлов `.vue`
+            {
+                test: /\.css$/,
+                use: [
+                  'vue-style-loader',
+                  'css-loader'
+                ]
+            },
         ]
     },
 

build/webpack.prod.config.js

@@ -3,6 +3,7 @@ const webpack = require("webpack");
 
 const merge = require("webpack-merge");
 const baseWpConfig = require("./webpack.base.config");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 
 module.exports = merge(baseWpConfig, {
     mode: 'production',
@@ -11,7 +12,27 @@ module.exports = merge(baseWpConfig, {
             {
                 test: /\.vue$/,
                 loader: "vue-loader",
+            },
+            {
+                test: /\.css$/,
+                use: [
+                  MiniCssExtractPlugin.loader,
+                  'css-loader'
+                ]
             }
         ]
     },
+    plugins: [
+        new webpack.DefinePlugin({
+            "process.env": {
+                "NODE_ENV": JSON.stringify("production")
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            minimize: true
+        }),
+        new MiniCssExtractPlugin({
+            filename: "[name].css"
+        })
+    ]
 });

package-lock.json

@@ -5166,6 +5166,30 @@
       "integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
       "dev": true
     },
+    "mini-css-extract-plugin": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.5.0.tgz",
+      "integrity": "sha512-IuaLjruM0vMKhUUT51fQdQzBYTX49dLj8w68ALEAe2A4iYNpIC4eMac67mt3NzycvjOlf07/kYxJDc0RTl1Wqw==",
+      "dev": true,
+      "requires": {
+        "loader-utils": "^1.1.0",
+        "schema-utils": "^1.0.0",
+        "webpack-sources": "^1.1.0"
+      },
+      "dependencies": {
+        "schema-utils": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
+          "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==",
+          "dev": true,
+          "requires": {
+            "ajv": "^6.1.0",
+            "ajv-errors": "^1.0.0",
+            "ajv-keywords": "^3.1.0"
+          }
+        }
+      }
+    },
     "minimalistic-assert": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",

package.json

@@ -26,6 +26,7 @@
     "eslint-plugin-node": "^8.0.0",
     "eslint-plugin-vue": "^5.0.0",
     "file-loader": "^3.0.1",
+    "mini-css-extract-plugin": "^0.5.0",
     "pkg": "^4.3.5",
     "url-loader": "^1.1.2",
     "vue-loader": "^15.4.2",