react typescript without webpack load image from css file

I install npx create-react-app my-app --template typescript

and I load CSS file then occur error like this:

Compiled with problems:X

ERROR in ./src/css/common.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].oneOf[5].use[2]!./src/css/common.css) 5:36-105

Module not found: Error: Can't resolve '../public/asset/images/ico_check1_off.png' in '/Volumes/JsWeb/ejmComp/wooriga/web/src/css'

ERROR in ./src/css/common.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].oneOf[5].use[2]!./src/css/common.css) 6:36-104

Module not found: Error: Can't resolve '../public/asset/images/ico_check1_on.png' in '/Volumes/JsWeb/ejmComp/wooriga/web/src/css'

And I add file images.d.ts:

/// <reference types="react-scripts" />

declare module '*.png';
declare module "*.jpg";
declare module '*.png' {
    const src: string;
    export default src;
}
declare module "*.jpeg";
declare module "*.gif";

tsconfig.json add:

     "compilerOptions": {
        "target": "es5",
        "typeRoots" : ["node_modules/@types", "src/types"],
        "lib": [
          "dom",
          "dom.iterable",
          "esnext"
        ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src",
    "src/types/images.d.ts",
    "**/*.ts", "**/*.tsx"
  ]
}

How can I load image from in CSS file without webpack?

That error make in CSS file:

.custom { display: flex; justify-content: center; align-items: center; width: 20px; height: 20px; margin-right: 20px; background: url('../asset/images/ico_check1_off.png') center center no-repeat; background-size: contain; }

background: url('../asset/images/ico_check1_off.png')

occur Errors

But main.tsx call directly has no error:

<Image src="../asset/images/ico_check1_off.png"/>

only occur error call image from CSS file

folder

public
 - asset/images

src
 - component / main
   - main.tsx
 - component / css 
   - common.css