SvgPicture asset does not work and shows "Try connecting the name to one that is defined, or defining the name" error

Question

I have a Flutter project and I made a home.dart page and wanted to add icons in svg to AppBar, so here is my code:

import 'package:flutter/material.dart';

class HomePage extends StatelessWidget{
  const HomePage({super.key});

  @override
  Widget build(BuildContext context){
    return Scaffold(
      appBar: AppBar(
        title: Text(
            'Breakfast',
            style: TextStyle(
              color:Colors.black,
              fontSize: 18,
              fontWeight: FontWeight.bold
            ),
          ),
        centerTitle: true,
        backgroundColor: Colors.white,
        elevation: 0.0,
        leading:Container(
          margin:EdgeInsets.all(10),
          alignment: Alignment.center,
          child: SvgPicture.asset(
            'assets/icons/arrow-left.svg',
            height:20,
            width:20,
          ),
          decoration: BoxDecoration(
            color:Color(0xffF7F8F8),
            borderRadius: BorderRadius.circular(10)
          ),
        ),
        actions:[
          Container(
          margin:EdgeInsets.all(10),
          alignment: Alignment.center,
          width:37,
          child: SvgPicture.asset(
            'assets/icons/dots.svg',
            height:5,
            width:5,
          ),
          decoration: BoxDecoration(
            color:Color(0xffF7F8F8),
            borderRadius: BorderRadius.circular(10)
          ),
        ),
        ]
      ),
    );
  }
}

But I get this error at the IDE: "Undefined name 'svgPicture'. Try correcting the name to one that is defined, or defining the name."

And I have placed the icons arrow-left.svg and dots.svg at assets/icons directory and also ran the command flutter pub get but still the issue remains!

Here is the pubspec.yml file:

capture1

And this is the screenshot of my code in vscode:

capture2

So what is going wrong here? How can I import the svg icons properly to the file?

Answer 1

have you imported the SVG package?if yeas then run flutter clean && flutter pub get