Skip to content

Instantly share code, notes, and snippets.

@nealoke
Created December 16, 2017 16:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nealoke/b9adc553b63d09e5be3ef8b012d51fde to your computer and use it in GitHub Desktop.
Save nealoke/b9adc553b63d09e5be3ef8b012d51fde to your computer and use it in GitHub Desktop.
Error with webpack and webpack-sources
{
"name": "test-case-webpack",
"scripts": {
"clean": "rimraf ./dist/*",
"server": "webpack-dev-server",
"server:test": "webpack-dev-server --config webpack.config.production.js --env.phase test",
"build:dev": "npm run clean && webpack -d --progress ",
"build:test":
"npm run clean && webpack --config webpack.config.production.js --progress --env.phase test --env.stats true",
"build:prod":
"npm run clean && webpack --config webpack.config.production.js --progress --env.phase prod"
},
"devDependencies": {
"async": "~2.1.2",
"babili-webpack-plugin": "^0.1.2",
"breakpoint-sass": "^2.7.1",
"chunk-manifest-webpack-plugin": "^1.1.1",
"compression-webpack-plugin": "^1.0.0",
"copy-webpack-plugin": "^4.0.1",
"critical": "~0.8.0",
"css-entry-webpack-plugin": "^1.0.0-beta.4",
"css-loader": "^0.28.4",
"del": "~2.2.2",
"extract-text-webpack-plugin": "^3.0.0",
"fast-sass-loader": "^1.2.5",
"favicons-webpack-plugin": "0.0.7",
"file-loader": "^0.11.2",
"glob-all": "^3.1.0",
"gulp": "github:gulpjs/gulp#4.0",
"gulp-notify": "~2.2.0",
"gulp-open": "~2.0.0",
"gulp-plumber": "~1.1.0",
"gulp-robots": "~2.0.4",
"gulp-sitemap": "~4.2.0",
"gulp-ttf2woff": "~1.1.0",
"gulp-util": "~3.0.7",
"html-webpack-exclude-assets-plugin": "0.0.5",
"html-webpack-include-assets-plugin": "0.0.7",
"html-webpack-plugin": "^2.29.0",
"i": "^0.3.5",
"image-webpack-loader": "^3.3.1",
"imagemin-mozjpeg": "~6.0.0",
"jshint": "~2.9.4",
"node-sass": "^4.5.3",
"postcss-loader": "^2.0.6",
"preload-webpack-plugin": "^1.2.2",
"purify-css": "^1.2.5",
"purifycss-webpack": "^0.7.0",
"react-hot-loader": "^3.0.0-beta.7",
"react-wastage-monitor": "^0.2.3",
"rimraf": "^2.6.1",
"sass-loader": "^6.0.6",
"style-loader": "^0.18.2",
"through2": "~2.0.1",
"vinyl-ftp": "~0.5.0",
"webpack": "^3.3.0",
"webpack-bundle-analyzer": "^2.8.3",
"webpack-chunk-hash": "^0.4.0",
"webpack-dashboard": "^0.4.0",
"webpack-dev-server": "^2.6.1",
"webpack-extraneous-file-cleanup-plugin": "^1.0.3",
"webpack-manifest-plugin": "^1.2.1",
"webpack-pwa-manifest": "^3.2.0",
"webpack-sources": "1.0.1",
"why-did-you-update": "0.0.8",
"yargs": "~6.3.0"
}
}
const webpack = require("webpack");
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
devtool: "eval",
context: path.resolve(__dirname, "src"),
entry: {
app: ["babel-polyfill", "react-hot-loader/patch", "./js/index.js"],
styles: "./styles/global.scss"
},
output: {
path: path.resolve(__dirname, "dist"),
publicPath: "/",
filename: "[name].js"
},
module: {
rules: [
{
test: /\.scss$/,
include: [
path.join(__dirname, "src/styles/")
],
use: ["style-loader", "css-loader", "fast-sass-loader"]
},
{
test: /\.js$/,
include: [
path.join(__dirname, "src/js/")
],
use: [
"react-hot-loader/webpack",
{
loader: "babel-loader",
options: {
presets: ["es2015", "stage-0", "react"]
}
}
]
},
{
test: /\.(jpe?g|png|gif|svg)$/i,
use: [
{
loader: "file-loader",
query: {
name: "[path][name]-[hash:4].[ext]",
outputPath: "/",
publicPath: ""
}
},
"image-webpack-loader"
]
},
{
test: /\.(woff|woff2|eot|ttf|otf)$/,
use: [
{
loader: "file-loader",
query: {
name: "[path][name]-[hash:4].[ext]",
outputPath: "/",
publicPath: ""
}
}
]
}
]
},
devServer: {
contentBase: path.join(__dirname, "dist"),
publicPath: "/",
compress: true,
hot: true,
stats: "minimal",
open: true,
historyApiFallback: true,
port: 8081,
openPage: "" // <- workaround for dev-server bug (https://github.com/webpack/webpack-dev-server/issues/960)
},
plugins: [
new HtmlWebpackPlugin({
title: "Wizer",
hash: true,
cache: true,
template: "index.ejs"
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NamedModulesPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.optimize.CommonsChunkPlugin({
name: "vendor",
filename: "vendor.js",
minChunks(module, count) {
const context = module.context;
return context && context.indexOf("node_modules") >= 0;
}
})
]
};
const webpack = require("webpack");
const path = require("path");
const glob = require("glob");
const globAll = require("glob-all");
const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
const HtmlWebpackPlugin = require("html-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const WebpackChunkHash = require("webpack-chunk-hash");
const ManifestPlugin = require("webpack-manifest-plugin");
const PreloadWebpackPlugin = require("preload-webpack-plugin");
const BabiliPlugin = require("babili-webpack-plugin");
const HtmlWebpackExcludeAssetsPlugin = require("html-webpack-exclude-assets-plugin");
const FaviconsWebpackPlugin = require("favicons-webpack-plugin");
const CompressionPlugin = require("compression-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const WebpackPwaManifest = require("webpack-pwa-manifest");
module.exports = env => ({
devtool: "source-map",
context: path.resolve(__dirname, "src"),
entry: {
app: ["babel-polyfill", "./js/index.js"],
styles: "./styles/global.scss"
},
output: {
path: path.resolve(__dirname, "dist"),
publicPath: "/",
filename: "[name].[chunkhash].js",
chunkFilename: "[name].[chunkhash].js",
sourceMapFilename: "[name].[chunkhash].map"
},
module: {
rules: [
{
test: /\.scss$/,
use: ExtractTextPlugin.extract({
fallback: "style-loader",
use: [
{
loader: "css-loader",
options: {
localIdentName: "[hash:base64:5]",
minimize: true,
sourceMap: true
}
},
{
loader: "postcss-loader",
options: {
sourceMap: true,
plugins: loader => [
require("autoprefixer")({
browsers: [">1%", "last 4 versions", "Firefox ESR", "not ie < 9"],
flexbox: "no-2009"
})
]
}
},
{
loader: "sass-loader",
options: {
outputStyle: "collapsed",
sourceMap: true,
includePaths: [path.resolve(__dirname, "src", "styles")]
}
}
],
publicPath: "/dist"
})
},
{
test: /\.js$/,
include: [
path.join(__dirname, "src/js/")
],
use: [
{
loader: "babel-loader",
options: {
presets: [
[
"env",
{
targets: {
browsers: [">1%", "last 4 versions", "Firefox ESR", "not ie < 9"]
}
}
],
"stage-0",
"react"
],
plugins: [
"lodash",
[
"transform-imports",
{
"redux-form": {
transform: "redux-form/es/${member}",
preventFullImport: true
}
}
],
"transform-object-rest-spread",
"transform-react-remove-prop-types"
]
}
}
]
},
{
test: /\.(jpe?g|png|gif|svg)$/i,
use: [
{
loader: "file-loader",
query: {
name: "[path][name]-[hash:4].[ext]",
outputPath: "/",
publicPath: ""
}
},
{
loader: "image-webpack-loader",
query: {
optipng: {
optimizationLevel: 7
},
gifsicle: {
interlaced: true
},
mozjpeg: {
progressive: true
}
}
}
]
},
{
test: /\.(woff|woff2|eot|ttf|otf)$/,
use: [
{
loader: "file-loader",
query: {
name: "[path][name]-[hash:4].[ext]",
outputPath: "/",
publicPath: ""
}
}
]
}
]
},
resolve: {
modules: ["js", path.join(__dirname, "node_modules"), "node_modules"]
},
devServer: {
contentBase: path.join(__dirname, "dist"),
publicPath: "/",
compress: true,
stats: "minimal",
open: true,
historyApiFallback: true,
openPage: "" // <- workaround for dev-server bug (https://github.com/webpack/webpack-dev-server/issues/960)
},
plugins: [
new BundleAnalyzerPlugin({
analyzerMode: "static",
analyzerHost: "127.0.0.1",
analyzerPort: 8888,
defaultSizes: "parsed",
openAnalyzer: env.stats,
generateStatsFile: false,
statsOptions: null,
logLevel: "info"
}),
new webpack.DefinePlugin({
"process.env": {
NODE_ENV: JSON.stringify("production"),
isTest: env.phase === "test"
}
}),
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false
}),
new HtmlWebpackPlugin({
title: "Wizer",
hash: false,
production: true,
minify: {
removeComments: true,
collapseWhitespace: true,
removeRedundantAttributes: true,
useShortDoctype: true,
removeEmptyAttributes: true,
removeStyleLinkTypeAttributes: true,
keepClosingSlash: true,
minifyJS: true,
minifyCSS: true,
minifyURLs: true
},
template: "index.ejs",
excludeAssets: [/styles.*.js/]
}),
new HtmlWebpackExcludeAssetsPlugin(),
new ExtractTextPlugin({
filename: "[name].[contenthash].css",
disable: false,
allChunks: true
}),
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
warnings: false,
screw_ie8: true,
conditionals: true,
unused: true,
comparisons: true,
sequences: true,
dead_code: true,
evaluate: true,
if_return: true,
join_vars: true
}
}),
new BabiliPlugin(),
new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /be/),
new webpack.optimize.CommonsChunkPlugin({
name: "vendor",
filename: "vendor.[chunkhash].js",
minChunks(module, count) {
const context = module.context;
return context && context.indexOf("node_modules") >= 0;
}
}),
new CompressionPlugin({
asset: "[path].gz[query]",
algorithm: "gzip",
test: /\.(js|css)$/
}),
new webpack.optimize.ModuleConcatenationPlugin(),
new webpack.HashedModuleIdsPlugin(),
new WebpackChunkHash(),
new ManifestPlugin({
fileName: "manifest.json"
}),
new PreloadWebpackPlugin({
rel: "preload",
as: "script",
include: "all",
fileBlacklist: [/styles.*.js/, /\.map/]
}),
new CopyWebpackPlugin([{ from: "./.htaccess" }]),
new FaviconsWebpackPlugin({
logo: "../src/assets/icons/base.png",
prefix: "assets/icons/[hash]-",
title: "Wizer Dashboard",
background: "transparent",
inject: true,
persistentCache: false,
emitStats: false,
icons: {
android: false,
appleIcon: { background: "#fff" },
appleStartup: { offset: 25 },
coast: false,
favicons: true,
firefox: true,
opengraph: true,
twitter: true,
yandex: false,
windows: false
}
}),
new WebpackPwaManifest({
name: "Wizer Dashboard",
short_name: "Wizer Dashboard",
description: "Wizer dashboard for collected feedback and settings",
theme_color: "#8BCBDA",
"theme-color": "#8BCBDA",
background_color: "#ffffff",
start_url: "/",
display: "standalone",
orientation: "portrait",
ios: {
"apple-mobile-web-app-title": "Wizer Dashboard",
"apple-mobile-web-app-status-bar-style": "#8BCBDA"
},
fingerprints: true,
inject: true,
icons: [
{
src: path.resolve("src/assets/icons/android.png"),
sizes: [96, 128, 192, 256, 384, 512],
destination: path.join("assets", "icons")
}
]
})
]
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment