Context
I have a parent component in vscode.
parent.html
<template>
<my-child-component></my-child-component>
</template>
parent.js
import { LightningElement, api } from 'lwc';
export default class Parent extends LightningElement {}
I have a child component in different files using SFDX vscode.
myChildComponent.html
<template>
<div>Hello World</div>
</template>
myChildComponent.js
import { LightningElement, api } from 'lwc';
export default class Parent extends LightningElement {}
My vscode file structure looks like this:
--force-app
--|main
---|default
----|aura
----|lwc
-----|app
------|parent.html
------|parent.js
------|myChildComponent.html
------|myChildComponent.js
----|.eslintrc.json
----|jsconfig.json
My jsconfig.json looks like this.
{
"compilerOptions": {
"experimentalDecorators": true,
"baseUrl": ".",
"paths": {
"c/player": [
"app/parent.js",
]
}
},
"include": [
"**/*",
"../../../../.sfdx/typings/lwc/**/*.d.ts"
]
}
Question
How do I add the myChildComponent into the parent component using SFDX and vscode? I have tried running the code as is above, and I have tried adding this into the jsconfig.json
"paths": {
"c/player": [
"app/parent.js",
"app/myChildComponent.js"
]
}