相关疑难解决方法(0)

这两者究竟有什么区别？我见过人们使用:

function foo () {
  ...
}

export default foo;

而且我见过:

function bar () {
  ...
}

export bar;

另外,你为什么要使用另一个呢？

我正在尝试将本地 png 图像导入到我的 ts webpack 项目中，但出现以下错误。

TS2307: Cannot find module './images/logo.png'.

我所有的其他模块都可以正常导入，即；我的 css、svg 和 ts 文件。它似乎只发生在 png 上。

我的 webpack.config.js 模块部分

module: {
    rules: [{
      test: /\.ts$/,
      use:['ts-loader']
    },{
      test: /\.css$/,
      use: ['style-loader', 'css-loader']
    },{
      test: /\.(woff|woff2|eot|ttf|svg)$/,
      use: ['url-loader?limit=100000']
    },{
      test: /\.png$/,
      use: ['file-loader']
    }]
  }

我的 tsconfig.json

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "module": "CommonJS",
    "target": "ES5",
    "lib": ["DOM", "ES2015.Promise", "ES5"],
    "allowJs": true,
    "alwaysStrict": true
  }
}

我的进口声明

import Logo from './images/logo.png';

我的文件结构

root
-src
--css
--images
---logo.png …

我正在尝试导入图像以在使用TypeScript的React组件中使用.我正在使用的捆绑包是Parcel(不是Webpack).

我.d.ts在项目中创建了一个带有图像文件扩展名的文件,并将其包含在里面tsconfig.json.但是,当我尝试导入图像时,T​​S对我大吼大叫Cannot find module.

我的项目结构:

+ src
  + assets
    - image.jpg
  + components
    - Box.tsx
    - App.tsx
  - index.d.ts
  - index.html
  - index.tsx
- tsconfig.json
- tslint.json

我试着App.tsx像这样导入图像.VS Code强调 '../assets/image.jpg'并说Cannot find module '../assets/image.jpg'.

import * as React from 'react';
import * as img from '../assets/image.jpg';

const Box = props => {
  // do things...
}

export default Box;

我在网上发现的讨论指出需要.d.ts自己定义一个文件,所以我index.d.ts用这一行创建了这个文件.

declare module '*.jpg';

然后加入"include": ["./src/index.d.ts"] …

我看到这个答案建议导入图像的语法如下所示(注释掉).在我的情况下,它没有成功(抱怨在该文件中找不到任何模块),我不得不切换到当前活动的语法.

// import Author from "../assets/author.png";
var Author = require("../assets/author.png");

我可以想象的差异是我正在使用TypeScript(通过awesome- typescript -loader转换我的TSX 并加载我的PNG 文件加载器),他们似乎使用JSX.但就我的理解而言,这一切都转化为普通的JS并最终要求.

作为React的菜鸟,我不确定这种差异的原因是什么,但我也不确定要谷歌如何调查自己.

我使用 Parcel 编译器建立了自己的打字稿项目，并让所有内容都在内置服务器上运行。我实现了 pixi.js 并希望将 .png 文件导入到我的 .ts 文件中。但是当我尝试导入时，它说找不到该模块，即使这两个文件位于同一文件夹中？我缺少什么？

我尝试执行以下操作

npm install @types/node --save-dev

tsconfig.json（位于我的根文件夹中）

{
  "compilerOptions": {
    "types": ["node"],
    "typeRoots": ["node_modules/@types"]
  }
}

我在这里找到了一个解决方案:Webpack和Typescript图像导入

但我得到的错误是:

[ts]
Types of property 'src' are incompatible.
  Type 'typeof import("*.png")' is not assignable to type 'string | undefined'.
    Type 'typeof import("*.png")' is not assignable to type 'string'.

我想我需要以某种方式投射导入,但无法弄清楚如何.我在React做这个.我看到该src属性被定义为string | undefined,这就是错误弹出的原因.

这是代码:

import * as Logo from 'assets/images/logo.png';

HTML:

<img src={Logo} alt="" />

并根据上述解决方案定义:

declare module "*.png" {
  const value: string;
  export default value;
}

Tsconfig:

{
  "compilerOptions": {
    "baseUrl": "./",
    "jsx": "react",
    "lib": ["es5", "es6", "dom"],
    "module": "commonjs",
    "noImplicitAny": false,
    "outDir": "./dist/",
    "sourceMap": …