envs
envs copied to clipboard
Component with only SVG fails in React Typescript
Describe the bug
Receiving error on build on file not found when trying to build react component that imports an svg file.
Steps to Reproduce
- create-react-app --typescript
- add a simple component (e.g. navbar - code bellow) that takes the logo.svg that is generated in the root
- Make the svg into a component under styles namespace
- make the navbar into a component.
- Use the following compiler: "bit.envs/compilers/[email protected]"
- bit build - you will get the error
Note that this will happen also if you remove the compiler to styles/*
import React from 'react';
import './navbar.css';
import logo from '../../logo.svg';
const Navbar: React.FC = () => {
return (
<div className="navbar">
<header className="App-header">
<p>I am something else</p>
<i>{logo}</i>
</header>
</div>
);
}
export default Navbar;
Expected Behavior
bit build should success.
Screenshots, exceptions and logs
` `` error: bit failed to build [email protected] with the following exception: ENOENT: no such file or directory, ensureSymlink '/var/folders/w2/frfs_j4n46s75383m2ld98xc0000gn/T/bit/capsule-69026/.dependencies/styles/logo/dist/logo.svg' Error: ENOENT: no such file or directory, ensureSymlink '/var/folders/w2/frfs_j4n46s75383m2ld98xc0000gn/T/bit/capsule-69026/.dependencies/styles/logo/dist/logo.svg'
If applicable, add screenshots, exceptions, and logs to help explain your problem.
### Specifications
- Bit version: 14.4.3
- Node version: 12.12.0
- npm / yarn version: yarn 1.19.1
- Platform: Macos
- Bit compiler (include version): see above
- Bit tester (include version): N/A
### Additional context
Add any other context about the problem here.
Can you try and add this in one of the component files ?
declare module ‘*.svg’ {
const content: any;
export const ReactComponent: any;
export default content;
}
It does not really fail - but an index file is created.
Can you please share a tar of the project?
Do a create react app and make the logo.svg file into a component.