Init webpack

Author: SerafimArts

.babelrc

@@ -0,0 +1,13 @@
+{
+    "presets": [
+        "es2015",
+        "stage-0"
+    ],
+    "plugins": [
+        "syntax-decorators",
+        "syntax-flow",
+        "transform-runtime",
+        "transform-decorators-legacy",
+        "transform-flow-comments"
+    ]
+}

package.json

@@ -0,0 +1,43 @@
+{
+    "private": true,
+    "main": "index.js",
+    "scripts": {
+        "build": "cross-env BABEL_ENV=production ./node_modules/.bin/webpack -p --config webpack.prod.js",
+        "watch": "cross-env BABEL_ENV=dev ./node_modules/.bin/webpack --config webpack.dev.js --progress --colors --watch",
+        "test": "npm run lint"
+    },
+    "keywords": [
+        "es6",
+        "babel",
+        "webpack"
+    ],
+    "license": "MIT",
+    "devDependencies": {
+        "babel-core": "^6.25.0",
+        "babel-loader": "^7.1.1",
+        "babel-plugin-transform-decorators-legacy": "^1.3.4",
+        "babel-plugin-transform-flow-comments": "^6.22.0",
+        "babel-plugin-transform-runtime": "^6.23.0",
+        "babel-preset-es2015": "^6.24.1",
+        "babel-preset-stage-0": "^6.24.1",
+        "babel-runtime": "^6.23.0",
+        "cross-env": "^5.0.1",
+        "css-loader": "^0.28.4",
+        "extract-text-webpack-plugin": "^3.0.0",
+        "html-loader": "^0.4.5",
+        "node-sass": "^4.5.3",
+        "postcss-loader": "^2.0.6",
+        "raw-loader": "^0.5.1",
+        "sass-lint": "^1.10.2",
+        "sass-loader": "^6.0.6",
+        "style-loader": "^0.18.2",
+        "vue-loader": "^13.0.1",
+        "vue-template-compiler": "^2.3.4",
+        "webpack": "^3.2.0"
+    },
+    "dependencies": {
+        "vue": "^2.3",
+        "babel-polyfill": "^6.26",
+        "font-awesome": "^4.7"
+    }
+}

postcss.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+    plugins: [
+        require('autoprefixer')
+    ]
+};

webpack.base.js

@@ -0,0 +1,88 @@
+const webpack            = require('webpack');
+const ExtractTextPlugin  = require('extract-text-webpack-plugin');
+
+module.exports = (config) => {
+    const JsLoader = [
+        {
+            loader:  'babel-loader',
+            options: {
+                sourceMap: true
+            }
+        },
+    ];
+
+    const CssLoader = ExtractTextPlugin.extract({
+        use:      [
+            {
+                loader:  'css-loader',
+                options: {
+                    url:       true,
+                    minimize:  true,
+                    import:    true,
+                    sourceMap: true
+                }
+            },
+            {
+                loader:  'postcss-loader',
+                options: {
+                    sourceMap: true
+                }
+            },
+            {
+                loader:  'sass-loader',
+                options: {
+                    includePaths: config.resolve,
+                    precision:    10,
+                    sourceMap:    true
+                }
+            }
+        ],
+        fallback: 'vue-style-loader'
+    });
+
+
+    return {
+        entry:   config.entry,
+        devtool: config.devtool,
+        output:  {
+            path:     config.out.path,
+            filename: (config.out.file || 'index') + '.js'
+        },
+        resolve: {
+            modules: config.resolve.concat(['node_modules']),
+            alias:   config.alias
+        },
+        module:  {
+            rules: [
+                {
+                    test:    /\.vue$/,
+                    loader:  'vue-loader',
+                    options: {
+                        esModule: false,
+                        preserveWhitespace: false,
+                        extractCSS:         true,
+                        loaders:            {
+                            scss: CssLoader,
+                            sass: CssLoader,
+                            css:  CssLoader,
+                            js:   JsLoader,
+                        }
+                    }
+                },
+                {
+                    test:    /\.js$/,
+                    include: config.resolve.concat(['node_modules']),
+                    use:     JsLoader
+                },
+                {
+                    test: /\.(:?sc|sa|c)ss$/,
+                    use:  CssLoader
+                },
+           ].concat(config.rules || [])
+        },
+        plugins: config.plugins.concat([
+            new ExtractTextPlugin((config.out.file || 'index') + '.css'),
+            new webpack.optimize.ModuleConcatenationPlugin(),
+        ])
+    }
+};

webpack.dev.js

@@ -0,0 +1,19 @@
+module.exports = require('./webpack.base.js')({
+    devtool: 'source-map',
+    entry:   `${__dirname}/src/index`,
+    out:     {
+        path: `${__dirname}/dist/`,
+        file: 'index'
+    },
+    resolve: [
+        `${__dirname}/src`,
+        `${__dirname}/src/styles`,
+    ],
+    alias:   {
+        vue: 'vue/dist/vue.js'
+    },
+    plugins: [
+
+    ],
+    rules: []
+});