How do you rename files without a billion errors?


#1

Hi,

What if I created a new page in my application, but I spelled the word for the page wrong.
For example if I write in the CLI:

ionic g pages/tbaPage

but what I wanted was:

ionic g pages/tabPage

Now, if I go ahead and rename the files manually, I will get the following error:

[ng] ERROR in ./src/app/pages/tabPage.page.ts
[ng] Module not found: Error: Can't resolve './tabPage.page.scss' in 'C:\Dev\myApplication\src\app\pages'

AND, I also get an error in my tabPage.page.spec.ts, where I get an error on the import, like this:

import { TabPagePage } from './tabPage.page';

Error:
[ts] Module '"c:/Dev/myApplication/src/app/pages/tabPage.page"' has no exported member 'TabPagePage'. [2305]

This can impossibly never had happen to anyone but me, yet NO valuable information or tutorial on this can be found.

Can the hero I need step forward? Haha :slight_smile:

All the best


#2

it’s easier to just create a new page and delete the old one. You could also search and replace every occurence of page name.

But the error you get means that somewhere in your tabPage.page.ts file, is exported ‘TbaPagePage’, not ‘TabPagePage’.


#3

It seems like this is something that needs to be fixed, because it’s very inefficient :confused:


#4

Managed to solve it anyway! :slight_smile:


#5

Hello,
I had to rename a page.
for that I did in visual studio:
1_ in search put the name of the page
2_below put the new name you want instead and click on “replace all” a window opens and asks to change the import click yes
3_ manually change the name of the folder and the files on the pages.
4_ close and open visual.

it worked well for me :slightly_smiling_face: