diff --git a/README.md b/README.md
index 94798f9..71fd866 100644
--- a/README.md
+++ b/README.md
@@ -65,8 +65,29 @@ import controllers from "./**/*_controller.js"
 controllers.forEach((controller) => {
   application.register(controller.name, controller.module.default)
 })
+
+// For view components
+// import componentControllers from '../components/**/*_controller.js';
+// ...
+
 ```
 
+Controller identifiers will be the name of the file + the parent folder except in `controllers/` folder:
+
+```
+app
+├── components
+│   ├── pref_component.html.erb
+│   ├── pref_component.rb
+│   └── pref_component_controller.js // identifier 'components--deploy-pref-component'
+└── javascript
+    └── controllers
+        ├── modal_controller.js // identifier 'modal'
+        └─- admin
+            └── status_controller.js // identifier 'admin--status'
+```
+
+
 #### Import ActionCable channels:
 
 ```javascript
diff --git a/src/index.js b/src/index.js
index ca0005d..77f5ca4 100644
--- a/src/index.js
+++ b/src/index.js
@@ -40,6 +40,8 @@ const railsPlugin = (options = { matcher: /.+\..+/ }) => ({
       const controllerNames = files
           .map((module) => module
             .replace(/_controller.[j|t]s$/, "")
+            .replace(/^controllers\//, "") // do not namespace controllers in controllers directory
+            .replace(/\.\.\//, "") // do not use parent folder anotation for controller name
             .replace(/\//g, "--")
             .replace(/_/g, '-')
           )