Skip to content

Commit

Permalink
Move resolve-url-loader into Next.js (vercel#32932)
Browse files Browse the repository at this point in the history
* Move resolve-url-loader into Next.js

Fixes vercel#32157

Moves resolve-url-loader into Next.js and strips out all features that are not used like `rework` support. Will reduce install size as well as allow for optimizing the approach in the near future.

* Update precompiled

* Use loader-utils 2

* Update trace test

* Revert "Update trace test"

This reverts commit 7c09a07.

* Add es5-ext as it's used in trace tests

* Update join-function.js

* Update bundle5.js
  • Loading branch information
timneutkens authored and natew committed Feb 16, 2022
1 parent 4aa8c6f commit 4ac46ec
Show file tree
Hide file tree
Showing 26 changed files with 804 additions and 114 deletions.
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,7 @@
"critters": "0.0.6",
"cross-env": "6.0.3",
"cross-spawn": "6.0.5",
"es5-ext": "0.10.53",
"escape-string-regexp": "2.0.0",
"eslint": "7.24.0",
"eslint-plugin-import": "2.22.1",
Expand Down
15 changes: 8 additions & 7 deletions packages/next/build/webpack/config/blocks/css/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,7 @@ export const css = curry(async function css(
...sassOptions
} = ctx.sassOptions

const lazyPostCSSInitalizer = () =>
const lazyPostCSSInitializer = () =>
lazyPostCSS(
ctx.rootDirectory,
ctx.supportedBrowsers,
Expand All @@ -165,8 +165,9 @@ export const css = curry(async function css(
// To fix this, we use `resolve-url-loader` to rewrite the CSS
// imports to real file paths.
{
loader: require.resolve('next/dist/compiled/resolve-url-loader'),
loader: require.resolve('../../../loaders/resolve-url-loader/index'),
options: {
postcss: lazyPostCSSInitializer,
// Source maps are not required here, but we may as well emit
// them.
sourceMap: true,
Expand Down Expand Up @@ -216,7 +217,7 @@ export const css = curry(async function css(
and: [ctx.rootDirectory],
not: [/node_modules/],
},
use: getCssModuleLoader(ctx, lazyPostCSSInitalizer),
use: getCssModuleLoader(ctx, lazyPostCSSInitializer),
}),
],
})
Expand All @@ -241,7 +242,7 @@ export const css = curry(async function css(
},
use: getCssModuleLoader(
ctx,
lazyPostCSSInitalizer,
lazyPostCSSInitializer,
sassPreprocessors
),
}),
Expand Down Expand Up @@ -303,7 +304,7 @@ export const css = curry(async function css(
and: [ctx.rootDirectory],
not: [/node_modules/],
},
use: getGlobalCssLoader(ctx, lazyPostCSSInitalizer),
use: getGlobalCssLoader(ctx, lazyPostCSSInitializer),
}),
],
})
Expand All @@ -321,7 +322,7 @@ export const css = curry(async function css(
sideEffects: true,
test: regexCssGlobal,
issuer: { and: [ctx.customAppFile] },
use: getGlobalCssLoader(ctx, lazyPostCSSInitalizer),
use: getGlobalCssLoader(ctx, lazyPostCSSInitializer),
}),
],
})
Expand All @@ -339,7 +340,7 @@ export const css = curry(async function css(
issuer: { and: [ctx.customAppFile] },
use: getGlobalCssLoader(
ctx,
lazyPostCSSInitalizer,
lazyPostCSSInitializer,
sassPreprocessors
),
}),
Expand Down
103 changes: 103 additions & 0 deletions packages/next/build/webpack/loaders/resolve-url-loader/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
/*
The MIT License (MIT)
Copyright (c) 2016 Ben Holloway
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/

import { SourceMapConsumer } from 'next/dist/compiled/source-map'
import valueProcessor from './lib/value-processor'
import { defaultJoin } from './lib/join-function'
import process from './lib/postcss'
/**
* A webpack loader that resolves absolute url() paths relative to their original source file.
* Requires source-maps to do any meaningful work.
* @param {string} content Css content
* @param {object} sourceMap The source-map
* @returns {string|String}
*/
export default async function resolveUrlLoader(content, sourceMap) {
const options = Object.assign(
{
sourceMap: this.sourceMap,
silent: false,
absolute: false,
keepQuery: false,
root: false,
debug: false,
join: defaultJoin,
},
this.getOptions()
)

let sourceMapConsumer
if (sourceMap) {
sourceMapConsumer = new SourceMapConsumer(sourceMap)
}

const callback = this.async()
const { postcss } = await options.postcss()
process(postcss, this.resourcePath, content, {
outputSourceMap: Boolean(options.sourceMap),
transformDeclaration: valueProcessor(this.resourcePath, options),
inputSourceMap: sourceMap,
sourceMapConsumer: sourceMapConsumer,
})
.catch(onFailure)
.then(onSuccess)

function onFailure(error) {
callback(encodeError('CSS error', error))
}

function onSuccess(reworked) {
if (reworked) {
// complete with source-map
// source-map sources are relative to the file being processed
if (options.sourceMap) {
callback(null, reworked.content, reworked.map)
}
// complete without source-map
else {
callback(null, reworked.content)
}
}
}

function encodeError(label, exception) {
return new Error(
[
'resolve-url-loader',
': ',
[label]
.concat(
(typeof exception === 'string' && exception) ||
(exception instanceof Error && [
exception.message,
exception.stack.split('\n')[1].trim(),
]) ||
[]
)
.filter(Boolean)
.join('\n '),
].join('')
)
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
/*
The MIT License (MIT)
Copyright (c) 2016 Ben Holloway
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/

/**
* Prepend file:// protocol to source path string or source-map sources.
*/
function prepend(candidate) {
if (typeof candidate === 'string') {
return 'file://' + candidate
} else if (
candidate &&
typeof candidate === 'object' &&
Array.isArray(candidate.sources)
) {
return Object.assign({}, candidate, {
sources: candidate.sources.map(prepend),
})
} else {
throw new Error('expected string|object')
}
}

exports.prepend = prepend

/**
* Remove file:// protocol from source path string or source-map sources.
*/
function remove(candidate) {
if (typeof candidate === 'string') {
return candidate.replace(/^file:\/{2}/, '')
} else if (
candidate &&
typeof candidate === 'object' &&
Array.isArray(candidate.sources)
) {
return Object.assign({}, candidate, {
sources: candidate.sources.map(remove),
})
} else {
throw new Error('expected string|object')
}
}

exports.remove = remove
Loading

0 comments on commit 4ac46ec

Please sign in to comment.