Specify aliases manually (source: "options")
Note: you don't need to add /*
part for directories in this case
const CracoAlias = require("craco-alias");
module.exports = {
plugins: [
{
plugin: CracoAlias,
options: {
source: "options",
baseUrl: "./",
aliases: {
"@file": "./src/file.js",
"@dir": "./src/some/dir",
"@material-ui": "./node_modules/@material-ui-ie10"
}
}
}
]
};
Use aliases from jsconfig.json (source: "jsconfig")
const CracoAlias = require("craco-alias");
module.exports = {
plugins: [
{
plugin: CracoAlias,
options: {
source: "jsconfig",
baseUrl: "./src"
}
}
]
};
Note: your jsconfig should always have compilerOptions.paths
property. baseUrl
is optional for plugin, but some IDEs and editors require it for intellisense.
{
"compilerOptions": {
"baseUrl": "./src",
"paths": {
"@baz": ["./baz.js"],
"@boo": ["./boo.jsx"],
"@root": ["./"],
"@root/*": ["./*"],
"@lib": ["./lib"],
"@lib/*": ["./lib/*"],
"@my-react-select": [
"../node_modules/react-select",
"../node_modules/@types/react-select"
],
"@my-react-select/*": [
"../node_modules/react-select/*",
"../node_modules/@types/react-select"
]
}
}
}