SilverStripe 4 GraphQL and GraphiQL UI not working even the procedures were followed properly from the documentation

<%- if @topic_view.topic.tags.present? %>
<%= t 'js.tagging.tags' %>: <%- @topic_view.topic.tags.each do |t| %> <%= t %> <%- end %>
<% end %>

Silverstripe Version:
4
Question:

I’m using SilverStripe 4 and applied a plug-in using composer require silverstripe/graphql .

After following the instructions from the document of silverstripe/graphql from this source: GitHub - silverstripe/silverstripe-graphql: Serves SilverStripe data as GraphQL representations, I can’t seem to access the GraphiQL of the GraphQL through this url localhost/silverstripe/dev/graphiql (silverstripe is the name of my folder in htdocs, graphiql is the UI counter part that will help me to perform queries for GraphQL )

GraphQL sample output:

Output for GraphiQL

GraphiQL sample output:

GraphiQL route not working

My namepace is SS\GraphQL

File Directory

Sample Code

Also applied this into my routes.yml file:

routes.yml

I have these inside a GraphQL folder inside the _config

GraphQL

membertypecreator.yml :

enter image description here

readmemberquerycreator.yml :

enter image description here

I’m actually lost right now for where I was not able to follow from the official documentation of silverstripe/graphql library. Can someone kindly help me out with this please? Thank you very much in advance!

Are you sure you are allowed to put YAML files inside subfolders? This is the first time I see it.

as far as I’ve seen my team’s previous projects with SS, they were allowed to create A LOT of YAML files inside subfolders. SilverStripe’s dev/build automatically crawls out to files even in subfolders