Issue 1:
I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

To work properly and frictionless with all kinds of webpack loaders.

Current Behavior

next dev seems to work with custom loaders, but it is very confusing, like what is the version of babel beeing used, you go to tutoriais on the internet and it uses options from older module versions

next build and next export doest integrate well with custom loaders, it thorwn a error.

Steps to Reproduce (for bugs)

Add the loaders to next.config.js

tip: find and run an example that is easy to hack

config.module.rules.push({ test: /\.(jpg|png))/, use: [{ loader: 'file-loader' }, { loader: 'url-loader', options: { limit: 1 } }]})

npm install -S file-loader url-loader

Context

From a fresh new create-next-app project, add a image to /static, import the image at /page/index.js, and use it as a url string <img src={myImage} />, then add the custom loader, and try to

1 - use development server

2 - build and use static version to production (npm i -g serve can help)

3 - build and use production server

Your Environment

Tech
Version

next
4.2

node
9.4

OS
Windows 10

Issue 2:
I'm trying to support IE11 for my app to fix the error

TypeError: Object doesn't support property or method 'find'

Using next 2.4.6 but also not working on latest beta

Added a custom .babelerc together with babel-preset-env with the following config:

{
"presets": [
"es2015",
"react",
"next/babel",
"stage-0",
[ "env", {
"targets": {
"safari": 10,
"ie": 11
},
"modules": false,
"useBuiltIns": true,
"debug": true
}]
],
}

Enabled the debug flag so on startup I get the following log, which seems to mean that the polyfill are added.

babel-preset-env: `DEBUG` option

Using targets:
{
"safari": "10",
"ie": "11"
}

Modules transform: false

Using plugins:
check-es2015-constants {"ie":"11"}
transform-es2015-arrow-functions {"ie":"11"}
transform-es2015-block-scoping {"ie":"11"}
transform-es2015-classes {"ie":"11"}
transform-es2015-computed-properties {"ie":"11"}
transform-es2015-destructuring {"ie":"11"}
transform-es2015-duplicate-keys {"ie":"11"}
transform-es2015-for-of {"ie":"11"}
transform-es2015-function-name {"ie":"11"}
transform-es2015-literals {"ie":"11"}
transform-es2015-object-super {"ie":"11"}
transform-es2015-parameters {"ie":"11"}
transform-es2015-shorthand-properties {"ie":"11"}
transform-es2015-spread {"ie":"11"}
transform-es2015-sticky-regex {"ie":"11"}
transform-es2015-template-literals {"ie":"11"}
transform-es2015-typeof-symbol {"ie":"11"}
transform-es2015-unicode-regex {"ie":"11"}
transform-regenerator {"ie":"11"}
transform-exponentiation-operator {"safari":"10","ie":"11"}
transform-async-to-generator {"safari":"10","ie":"11"}
syntax-trailing-function-commas {"ie":"11"}

Using polyfills:
es6.typed.array-buffer {"ie":"11"}
es6.typed.int8-array {"ie":"11"}
es6.typed.uint8-array {"ie":"11"}
es6.typed.uint8-clamped-array {"ie":"11"}
es6.typed.int16-array {"ie":"11"}
es6.typed.uint16-array {"ie":"11"}
es6.typed.int32-array {"ie":"11"}
es6.typed.uint32-array {"ie":"11"}
es6.typed.float32-array {"ie":"11"}
es6.typed.float64-array {"ie":"11"}
es6.map {"ie":"11"}
es6.set {"ie":"11"}
es6.weak-map {"ie":"11"}
es6.weak-set {"ie":"11"}
es6.reflect.apply {"ie":"11"}
es6.reflect.construct {"ie":"11"}
es6.reflect.define-property {"ie":"11"}
es6.reflect.delete-property {"ie":"11"}
es6.reflect.get {"ie":"11"}
es6.reflect.get-own-property-descriptor {"ie":"11"}
es6.reflect.get-prototype-of {"ie":"11"}
es6.reflect.has {"ie":"11"}
es6.reflect.is-extensible {"ie":"11"}
es6.reflect.own-keys {"ie":"11"}
es6.reflect.prevent-extensions {"ie":"11"}
es6.reflect.set {"ie":"11"}
es6.reflect.set-prototype-of {"ie":"11"}
es6.promise {"ie":"11"}
es6.symbol {"ie":"11"}
es6.object.assign {"ie":"11"}
es6.object.is {"ie":"11"}
es6.function.name {"ie":"11"}
es6.string.raw {"ie":"11"}
es6.string.from-code-point {"ie":"11"}
es6.string.code-point-at {"ie":"11"}
es6.string.repeat {"ie":"11"}
es6.string.starts-with {"ie":"11"}
es6.string.ends-with {"ie":"11"}
es6.string.includes {"ie":"11"}
es6.regexp.flags {"ie":"11"}
es6.regexp.match {"ie":"11"}
es6.regexp.replace {"ie":"11"}
es6.regexp.split {"ie":"11"}
es6.regexp.search {"ie":"11"}
es6.array.from {"ie":"11"}
es6.array.of {"ie":"11"}
es6.array.copy-within {"ie":"11"}
es6.array.find {"ie":"11"}
es6.array.find-index {"ie":"11"}
es6.array.fill {"ie":"11"}
es6.array.iterator {"ie":"11"}
es6.number.is-finite {"ie":"11"}
es6.number.is-integer {"ie":"11"}
es6.number.is-safe-integer {"ie":"11"}
es6.number.is-nan {"ie":"11"}
es6.number.epsilon {"ie":"11"}
es6.number.min-safe-integer {"ie":"11"}
es6.number.max-safe-integer {"ie":"11"}
es6.math.acosh {"ie":"11"}
es6.math.asinh {"ie":"11"}
es6.math.atanh {"ie":"11"}
es6.math.cbrt {"ie":"11"}
es6.math.clz32 {"ie":"11"}
es6.math.cosh {"ie":"11"}
es6.math.expm1 {"ie":"11"}
es6.math.fround {"ie":"11"}
es6.math.hypot {"ie":"11"}
es6.math.imul {"ie":"11"}
es6.math.log1p {"ie":"11"}
es6.math.log10 {"ie":"11"}
es6.math.log2 {"ie":"11"}
es6.math.sign {"ie":"11"}
es6.math.sinh {"ie":"11"}
es6.math.tanh {"ie":"11"}
es6.math.trunc {"ie":"11"}
es7.array.includes {"ie":"11"}
es7.object.values {"safari":"10","ie":"11"}
es7.object.entries {"safari":"10","ie":"11"}
es7.object.get-own-property-descriptors {"safari":"10","ie":"11"}
es7.string.pad-start {"ie":"11"}
es7.string.pad-end {"ie":"11"}
web.timers {"safari":"10","ie":"11"}
web.immediate {"safari":"10","ie":"11"}
web.dom.iterable {"safari":"10","ie":"11"}

However, at runtime, I still get the error on IE11 when I call the .find() method on an array.

Anything I can do to double check to make sure the polyfills are injected correctly?