英文:
Typescript does not include svg in build
问题
我有一个问题，通过 tsc --project tsconfig.dist.json 构建的项目（请参见下面的文件）不包括在代码中导入并在构建中使用的资源文件（.svg）。那么，我应该怎么做才能让 TypeScript 在构建中包括这些资源文件呢？
也许需要一些背景信息：这是一个使用 React 脚本等工具的 create-react-app 项目。正常的 npm start 可以正常工作，并在项目中需要和使用的地方加载资源文件。但是构建不包括这些文件。
tsconfig.dist.json 只引用了基本项目配置并设置了输出选项。
{
"extends": "./tsconfig.json",
"compilerOptions": {
"declaration": true,
"noEmit": false,
"outDir": "./dist"
}
}
用法示例（顺便说一下，资源文件夹位于 src 文件夹内）：
import image from '../assets/disconnected.svg';
import { ReactComponent } from '../assets/disconnected.svg';
编辑，因为可能不够清楚：
这不影响 webpack。这是关于直接使用 tsc 的独立用法，它不会报错，但不会在生成的代码中包括这些资源文件，从而导致 tsc 生成的代码失败。
英文:
i have a problem, that my build via tsc --project tsconfig.dist.json (see file below) does not include the assets (.svg) that are importet and used in the code in the build. So what do i have to do for typescript to include those in the build?
Maybe some background: it is a create-react-app project, using react scripts etc. A normal npm start works fine and also loads the assets where needed and used in the project. However the build does not include those files.
The tsconfig.dist.json only references the base project config and sets output options.
{
"extends": "./tsconfig.json",
"compilerOptions": {
"declaration": true,
"noEmit": false,
"outDir": "./dist"
}
}
Usage Example (the assets folder is within the src-folder btw):
import image from '../assets/disconnected.svg';
import { ReactComponent } from '../assets/disconnected.svg';
Edit because maybe it was not clear:
It does not affect webpack. It is about a standalone usage of tsc directly, that does not complain about errors but does not include those assets in the emitted code, making the emitted code by tsc fail.
答案1
得分: 1
这不是关于TypeScript的问题。你导入方式错误。
import image from '../assets/disconnected.svg'; // 这个是正确的
import { ReactComponent } from '../assets/disconnected.svg'; // 这个是错误的
英文:
This is not about typescript. You have imported it wrong.
import image from '../assets/disconnected.svg'; // this one is correct
import { ReactComponent } from '../assets/disconnected.svg'; // this one is wrong
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论