I am trying to create a custom cra-template file for my team to use, but keep hitting an issue where I receive the following error when running npx create-react-app test-app --template my-custom-template
.
internal/modules/cjs/loader.js:796
throw err;
^
Error: Cannot find module 'cra-template-my-custom-template'
Require stack:
- C:\Users\user\Desktop\cra-test-app\test-app\node_modules\react-scripts\scripts\init.js
- C:\Users\user\Desktop\cra-test-app\test-app\[eval]
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
at Function.resolve (internal/modules/cjs/helpers.js:80:19)
at module.exports (C:\Users\user\Desktop\cra-test-app\test-app\node_modules\react-scripts\scripts\init.js:110:13)
at [eval]:3:14
at Script.runInThisContext (vm.js:116:20)
at Object.runInThisContext (vm.js:306:38)
at Object.<anonymous> ([eval]-wrapper:9:26)
at Module._compile (internal/modules/cjs/loader.js:955:30)
at evalScript (internal/process/execution.js:80:25)
at internal/main/eval_string.js:23:3 {
code: 'MODULE_NOT_FOUND',
requireStack: [
'C:\\Users\\user\\Desktop\\cra-test-app\\test-app\\node_modules\\react-scripts\\scripts\\init.js',
'C:\\Users\\user\\Desktop\\cra-test-app\\test-app\\[eval]'
]
}
The template itself is fairly simple at the moment and I think the issue here may be that our team uses a private feed for some internal packages (which are dependencies in the template). This private feed is set to use npm as an upstream feed.
I have tried testing the template locally with the --template file:../path/to/template
method and publishing the template to our internal feed. I can install the package using npm install, so the package is definitely being found in the registry.
I have also tried refreshing the npm cache and uninstalling create-react-app per some other recommendations.
Do I have to publish the template to the public npm registry for this to work? Or am I missing something else?
My template's package.json file is as follows:
{
"name": "cra-template-my-custom-template",
"version": "1.0.5",
"keywords": [
"react",
"create-react-app",
"template",
"typescript"
],
"description": "The base template for React apps hosted within our project",
"files": [
"template",
"template.json"
]
}
and the template.json is as follows:
{
"package": {
"dependencies": {
"@<custom-feed-scope>/<custom-feed-library>": "^5.11.0",
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"@types/jest": "^24.9.1",
"@types/node": "^12.12.34",
"@types/react": "^16.9.32",
"@types/react-dom": "^16.9.6",
"<custom-feed-library>": "^3.2.1",
"<custom-feed-library>": "^0.2.4",
"typescript": "^3.7.5"
}
}
}
I am currently using npm instead of yarn, but I was able to create an app using the typescript template just fine.
After some research into other cra-template packages, it seems the missing piece here was not having the main
value defined in my template's package.json
file.
After changing the package.json
to what is below, it started working.
{
"name": "cra-template-my-custom-template",
"version": "1.0.8",
"keywords": [
"react",
"create-react-app",
"template",
"typescript"
],
"main": "template.json",
"description": "The base template for React apps hosted within our project",
"files": [
"template",
"template.json"
]
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With