Skip to content

Instantly share code, notes, and snippets.

@SigurdMW
Last active October 19, 2019 09:55
Show Gist options
  • Select an option

  • Save SigurdMW/bb774416baebfd2f820f959b4ae49e14 to your computer and use it in GitHub Desktop.

Select an option

Save SigurdMW/bb774416baebfd2f820f959b4ae49e14 to your computer and use it in GitHub Desktop.

Revisions

  1. SigurdMW revised this gist Aug 31, 2017. 1 changed file with 3 additions and 2 deletions.
    5 changes: 3 additions & 2 deletions package.json
    Original file line number Diff line number Diff line change
    @@ -7,7 +7,7 @@
    "test": "backstop test",
    "approve-tests": "backstop approve",
    "build": "set NODE_ENV=production && webpack -p",
    "watch": "webpack --watch"
    "watch": "webpack --cache=false --watch"
    },
    "author": "Sigurd Moland Wahl",
    "license": "ISC",
    @@ -26,6 +26,7 @@
    "file-loader": "^0.11.2",
    "node-sass": "^4.5.3",
    "path": "^0.12.7",
    "postcss-discard-duplicates": "^2.1.0",
    "postcss-loader": "^2.0.6",
    "sass-loader": "^6.0.6",
    "style-loader": "^0.18.2",
    @@ -37,4 +38,4 @@
    "a11y-dialog": "^3.0.2",
    "siema": "^1.4.6"
    }
    }
    }
  2. SigurdMW revised this gist Aug 31, 2017. 1 changed file with 20 additions and 19 deletions.
    39 changes: 20 additions & 19 deletions webpack.config.js
    Original file line number Diff line number Diff line change
    @@ -34,9 +34,15 @@ module.exports = [{
    },
    module: {
    loaders: [
    { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ },
    {
    test: /\.js$/,
    loader: 'babel-loader',
    exclude: /node_modules/,
    include: path.resolve(__dirname, "src")
    },
    {
    test: /\.scss$/,
    include: path.resolve(__dirname, "src"),
    loader: ExtractTextPlugin.extract({
    fallback: 'style-loader/useable',
    use: [
    @@ -50,7 +56,9 @@ module.exports = [{
    },
    {
    loader: 'postcss-loader',
    options: { sourceMap: true }
    options: {
    sourceMap: true
    }
    },
    {
    loader: 'sass-loader',
    @@ -59,14 +67,14 @@ module.exports = [{
    ]
    })
    },
    { test: /\.(jpg|jpeg|png)$/, use: 'file-loader?name=assets/[name].[hash].[ext]' },
    { test: /\.(webm|mp4)$/, use: 'file-loader?name=assets/[name].[hash].[ext]' },
    {
    test: /\.woff(2)?(\?[a-z0-9]+)?$/,
    include: path.resolve(__dirname, "src"),
    loader: "url-loader"
    },
    {
    test: /\.(ttf|eot|svg)(\?[a-z0-9]+)?$/,
    include: path.resolve(__dirname, "src"),
    loader: "file-loader"
    },
    ]
    @@ -85,6 +93,10 @@ module.exports = [{
    cacheId: 'skuld-cache',
    dontCacheBustUrlsMatching: /\.\w{8}\./,
    filepath: path.resolve("../") + "/" + serviceWorkerFileName,
    runtimeCaching: [
    { handler: 'fastest', urlPattern: /^https:\/\/fonts\.googleapis\.com/ },
    { handler: 'fastest', urlPattern: /^https:\/\/fonts\.gstatic\.com/}
    ],
    minify: false,
    navigateFallback: '/index.html',
    staticFileGlobsIgnorePatterns: [/\.map$/, /asset-manifest\.json$/],
    @@ -95,38 +107,27 @@ module.exports = [{
    entry: "./src/editor.css",
    output: {
    path: path.resolve('dist/editor'),
    filename: 'index_bundle.[hash].js'
    filename: 'editor.css'
    },
    module: {
    loaders: [
    {
    test: /\.css/,
    include: path.resolve(__dirname, "src"),
    loader: ExtractTextPlugin.extract({
    fallback: 'style-loader/useable',
    use: [
    {
    loader: 'css-loader',
    options: {
    autoprefixer: false,
    sourceMap: false,
    importLoaders: 1
    sourceMap: false
    }
    },
    {
    loader: 'postcss-loader',
    options: { sourceMap: true }
    }
    ]
    })
    }
    ]
    },
    plugins: [
    new ExtractTextPlugin('editor.css'),
    new webpack.DefinePlugin({
    'process.env': {
    'NODE_ENV': JSON.stringify('production')
    }
    })
    new ExtractTextPlugin('editor.css')
    ]
    }]
  3. SigurdMW revised this gist Aug 25, 2017. 1 changed file with 40 additions and 0 deletions.
    40 changes: 40 additions & 0 deletions package.json
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,40 @@
    {
    "name": "skuld-frontend",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
    "test": "backstop test",
    "approve-tests": "backstop approve",
    "build": "set NODE_ENV=production && webpack -p",
    "watch": "webpack --watch"
    },
    "author": "Sigurd Moland Wahl",
    "license": "ISC",
    "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.25.0",
    "babel-loader": "^7.1.1",
    "babel-minify": "^0.2.0",
    "babel-minify-webpack-plugin": "^0.2.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "clean-webpack-plugin": "^0.1.16",
    "css-loader": "^0.28.4",
    "cssnano": "^3.10.0",
    "extract-text-webpack-plugin": "^3.0.0",
    "file-loader": "^0.11.2",
    "node-sass": "^4.5.3",
    "path": "^0.12.7",
    "postcss-loader": "^2.0.6",
    "sass-loader": "^6.0.6",
    "style-loader": "^0.18.2",
    "sw-precache-webpack-plugin": "^0.11.4",
    "url-loader": "^0.5.9",
    "webpack": "^3.3.0"
    },
    "dependencies": {
    "a11y-dialog": "^3.0.2",
    "siema": "^1.4.6"
    }
    }
  4. SigurdMW created this gist Aug 25, 2017.
    132 changes: 132 additions & 0 deletions webpack.config.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,132 @@
    const path = require('path');
    const webpack = require('webpack');
    const ExtractTextPlugin = require('extract-text-webpack-plugin');
    const CleanWebpackPlugin = require('clean-webpack-plugin');
    const MinifyPlugin = require("babel-minify-webpack-plugin");
    const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin');

    console.log("Current ENV is: " + process.env.NODE_ENV);

    const PUBLIC_PATH = "/assets/dist/";

    // TODO cache google fonts with service worker
    // if change filename: remember to change reference to this file in _Root.cshtml
    const serviceWorkerFileName = "service-worker.js";

    const cleanOptions = {
    root: path.resolve("../"),
    verbose: true,
    dry: false,
    watch: true,
    }

    const pathsToClean = [
    'assets/dist',
    serviceWorkerFileName,
    ];

    module.exports = [{
    entry: "./src/main.js",
    output: {
    path: path.resolve('dist'),
    filename: 'index_bundle.[hash].js',
    publicPath: PUBLIC_PATH
    },
    module: {
    loaders: [
    { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ },
    {
    test: /\.scss$/,
    loader: ExtractTextPlugin.extract({
    fallback: 'style-loader/useable',
    use: [
    {
    loader: 'css-loader',
    options: {
    autoprefixer: false,
    sourceMap: true,
    importLoaders: 1
    }
    },
    {
    loader: 'postcss-loader',
    options: { sourceMap: true }
    },
    {
    loader: 'sass-loader',
    options: { sourceMap: true }
    }
    ]
    })
    },
    { test: /\.(jpg|jpeg|png)$/, use: 'file-loader?name=assets/[name].[hash].[ext]' },
    { test: /\.(webm|mp4)$/, use: 'file-loader?name=assets/[name].[hash].[ext]' },
    {
    test: /\.woff(2)?(\?[a-z0-9]+)?$/,
    loader: "url-loader"
    },
    {
    test: /\.(ttf|eot|svg)(\?[a-z0-9]+)?$/,
    loader: "file-loader"
    },
    ]
    },
    plugins: [
    new CleanWebpackPlugin(pathsToClean, cleanOptions),
    new ExtractTextPlugin('styles.[hash].css'),
    new webpack.DefinePlugin({
    'process.env': {
    'NODE_ENV': JSON.stringify('production')
    }
    }),
    new MinifyPlugin(),
    new SWPrecacheWebpackPlugin(
    {
    cacheId: 'skuld-cache',
    dontCacheBustUrlsMatching: /\.\w{8}\./,
    filepath: path.resolve("../") + "/" + serviceWorkerFileName,
    minify: false,
    navigateFallback: '/index.html',
    staticFileGlobsIgnorePatterns: [/\.map$/, /asset-manifest\.json$/],
    }
    )
    ]
    }, {
    entry: "./src/editor.css",
    output: {
    path: path.resolve('dist/editor'),
    filename: 'index_bundle.[hash].js'
    },
    module: {
    loaders: [
    {
    test: /\.css/,
    loader: ExtractTextPlugin.extract({
    fallback: 'style-loader/useable',
    use: [
    {
    loader: 'css-loader',
    options: {
    autoprefixer: false,
    sourceMap: false,
    importLoaders: 1
    }
    },
    {
    loader: 'postcss-loader',
    options: { sourceMap: true }
    }
    ]
    })
    }
    ]
    },
    plugins: [
    new ExtractTextPlugin('editor.css'),
    new webpack.DefinePlugin({
    'process.env': {
    'NODE_ENV': JSON.stringify('production')
    }
    })
    ]
    }]