This repository was archived by the owner on Jul 19, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 1
failed to resolve id #1
Copy link
Copy link
Open
Description
Hi. I use CRA with eject, here is my webpack settings file:
const resolver = require('postcss-import-alias-resolver');
….
{
// Options for PostCSS as we reference these options twice
// Adds vendor prefixing based on your specified browser support in
// package.json
loader: require.resolve('postcss-loader'),
options: {
// Necessary for external CSS imports to work
// https://github.com/facebook/create-react-app/issues/2677
ident: 'postcss',
plugins: () => [
require('postcss-import')({
resolve: resolver({
alias: {
/* lb: path.resolve('./src/lib'), */
'@': path.resolve('./src'),
lb: path.resolve('./src/lib')
},
extensions: [ '.css' ],
/* modules: [ 'assets/libs', 'node_modules' ], */
dontPrefix: false, // do not enforce '~' prefix to aliases
/* webpackConfig: require('./webpack.conf.js'), */
mergeAlias: 'extend',
mergeModules: 'extend',
mergeExtensions: 'replace',
onResolve(id, base, resolvedPath) {
console.log(`id ${id} resolved to ${resolvedPath}`);
// if you want to override then return new path
/* if (override === true) return 'some/new/path'; */
},
onFail(id, base) {
console.log(`failed to resolve id ${id} from ${base}`);
// if you want to override then return new path
/* if (override === true) return 'some/new/path'; */
}
})
}),
require('postcss-custom-properties')({
preserve: false,
importFrom: './src/lib/var/variables.css'
}),
require('postcss-flexbugs-fixes'),
require('postcss-preset-env')({
autoprefixer: {
flexbox: 'no-2009'
},
stage: 0
}),
// Adds PostCSS Normalize as the reset css with default options,
// so that it honors browserslist config in package.json
// which in turn let's users customize the target behavior as per their needs.
postcssNormalize(),
require('postcss-conditionals'),
require('postcss-mixins'),
require('postcss-simple-vars'),
require('postcss-color-function'),
require('postcss-nested')
],
sourceMap: isEnvProduction && shouldUseSourceMap
}
}
Here is my import in css file
@import "~lb/lib/lib.css";
But in the console, I get an error when resolve (last line)
id ../../lib/lib.css resolved to H:\courses\react-hooks-self-update\src\lib\lib.css
id ./grid/post-grid.css resolved to H:\courses\react-hooks-self-update\src\lib\grid\post-grid.css
failed to resolve id ~lb/lib/lib.css from H:\courses\react-hooks-self-update\src\components\menuAdaptive
And
Error: ENOENT: no such file or directory, stat 'H:\courses\react-hooks-self-update\src\components\menuAdaptive\~lb\lib\lib.css'
Metadata
Metadata
Assignees
Labels
No labels