mirror of
https://github.com/terribleplan/next.js.git
synced 2024-01-19 02:48:18 +00:00
[BUG] Fix emit-file-loader compatibility with Webpack 4 (#4918)
## Context When upgrading to Next.js 6.1.1-canary.4 and using the `emit-file-loader` included in Next.js, the following error is thrown: ```bash error in ./src/graveyard/pages/_app.scss Module build failed (from ../node_modules/next/dist/build/webpack/loaders/emit-file-loader.js): TypeError: Cannot read property 'context' of undefined at Object.module.exports (~/project-root/node_modules/next/dist/build/webpack/load ers/emit-file-loader.js:27:68) @ ./src/pages/_app.js 35:0-53 156:17-26 157:13-22 @ multi ./pages/_app.js ``` `next.config.js` (shortened): ```js module.exports = { webpack: (config, { dev }) => { config.module.rules.push({ test: /\.scss$/, use: [ { loader: 'emit-file-loader', options: { name: 'dist/[path][name].[ext].js' } }, { loader: 'babel-loader', options: { babelrc: false, extends: path.resolve(__dirname, './src/.babelrc') } }, 'styled-jsx-css-loader', { loader: 'postcss-loader', options: { sourceMap: dev } }, { loader: 'sass-loader', options: { sourceMap: dev } } ] }); return config; } }; ``` ## Suggested Fix A quick Google search brought me to a [related issue in `webpack-loader`](https://github.com/webpack-contrib/worker-loader/issues/125). As pointed out in the [Webpack docs](https://webpack.js.org/api/loaders/#this-rootcontext): > Starting with webpack 4, the formerly `this.options.context` is provided as `this.rootContext`. This PR makes this change while maintaining backward compatibility. ## System information Next.js: 6.1.1-canary.4 Node: v9.3.0
This commit is contained in:
parent
6de99ebc4a
commit
b50bad56be
|
@ -18,7 +18,7 @@ module.exports = function (content, sourceMap) {
|
||||||
}
|
}
|
||||||
|
|
||||||
const name = query.name || '[hash].[ext]'
|
const name = query.name || '[hash].[ext]'
|
||||||
const context = query.context || this.options.context
|
const context = query.context || this.rootContext || this.options.context
|
||||||
const regExp = query.regExp
|
const regExp = query.regExp
|
||||||
const opts = { context, content, regExp }
|
const opts = { context, content, regExp }
|
||||||
const interpolateName = query.interpolateName || ((name) => name)
|
const interpolateName = query.interpolateName || ((name) => name)
|
||||||
|
|
Loading…
Reference in a new issue