SHARE
TWEET

webpack

a guest May 19th, 2019 130 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. const path = require("path");
  2. const webpack = require("webpack");
  3. const ExtractTextPlugin = require("extract-text-webpack-plugin");
  4.  
  5. // Set different CSS extraction for editor only and common block styles
  6. const blocksCSSPlugin = new ExtractTextPlugin({
  7.   filename: "./assets/css/countdown.build.css"
  8. });
  9. const editBlocksCSSPlugin = new ExtractTextPlugin({
  10.   filename: "./assets/css/countdown.editor.build.css"
  11. });
  12.  
  13. // Configuration for the ExtractTextPlugin.
  14. const extractConfig = {
  15.   use: [
  16.     { loader: "raw-loader" },
  17.     {
  18.       loader: "postcss-loader",
  19.       options: {
  20.         plugins: [require("autoprefixer")]
  21.       }
  22.     },
  23.     {
  24.       loader: "sass-loader",
  25.       query: {
  26.         outputStyle:
  27.           "production" === process.env.NODE_ENV ? "compressed" : "nested"
  28.       }
  29.     }
  30.   ]
  31. };
  32. // Configuration for the babel.
  33. const buildJS = {
  34.   loader: "babel-loader",
  35.   options: {
  36.     presets: ["@wordpress/default"],
  37.     plugins: [
  38.       [
  39.         "@babel/plugin-transform-react-jsx",
  40.         { pragma: "wp.element.createElement" }
  41.       ]
  42.     ]
  43.   }
  44. };
  45.  
  46. module.exports = {
  47.   mode: 'development',
  48.   entry: {
  49.     './assets/js/countdown.editor.build': './block/js/countdown.editor.js',
  50.     './assets/js/countdown.build' : './block/js/countdown.js',
  51.   },
  52.   output: {
  53.     path: path.resolve(__dirname),
  54.     filename: "[name].js"
  55.   },
  56.   devtool: "cheap-eval-source-map",
  57.   module: {
  58.     rules: [
  59.       {
  60.         test: /\.js$/,
  61.         exclude: /(node_modules|bower_components)/,
  62.         use: buildJS
  63.       },
  64.       {
  65.         test: /block\/css\/styles\/.*\.s?css$/,
  66.         use: blocksCSSPlugin.extract(extractConfig)
  67.       },
  68.       {
  69.         test: /block\/css\/editor-styles\/.*\.s?css$/,
  70.         use: editBlocksCSSPlugin.extract(extractConfig)
  71.       }
  72.     ]
  73.   },
  74.   plugins: [blocksCSSPlugin, editBlocksCSSPlugin]
  75. };
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top