diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap
index 1847fe11a..d6ee7b518 100644
--- a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap
+++ b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap
@@ -24,6 +24,7 @@ exports[`vue configuration for android 1`] = `
       vue: 'nativescript-vue'
     },
     extensions: [
+      '.android.vue',
       '.vue',
       '.android.ts',
       '.ts',
@@ -195,6 +196,7 @@ exports[`vue configuration for ios 1`] = `
       vue: 'nativescript-vue'
     },
     extensions: [
+      '.ios.vue',
       '.vue',
       '.ios.ts',
       '.ts',
diff --git a/packages/webpack5/src/configuration/base.ts b/packages/webpack5/src/configuration/base.ts
index 40f62e17b..63b2de0ad 100644
--- a/packages/webpack5/src/configuration/base.ts
+++ b/packages/webpack5/src/configuration/base.ts
@@ -5,6 +5,7 @@ import {
 	getDistPath,
 	getEntryPath,
 	getPackageJson,
+	getPlatform,
 } from '../helpers/project';
 
 import { CleanWebpackPlugin } from 'clean-webpack-plugin';
@@ -15,7 +16,7 @@ import TerserPlugin from 'terser-webpack-plugin';
 export default function (config: Config, env: IWebpackEnv): Config {
 	const entryPath = getEntryPath();
 	const distPath = getDistPath();
-	const platform = determinePlatformFromEnv(env);
+	const platform = getPlatform();
 	const packageJson = getPackageJson();
 	const mode = env.production ? 'production' : 'development';
 
@@ -175,20 +176,8 @@ export default function (config: Config, env: IWebpackEnv): Config {
 }
 
 function shouldIncludeInspectorModules(env: IWebpackEnv): boolean {
-	const platform = determinePlatformFromEnv(env);
+	const platform = getPlatform();
 	// todo: check if core modules are external
 	// todo: check if we are testing
 	return platform === 'ios';
 }
-
-function determinePlatformFromEnv(env: IWebpackEnv): Platform {
-	if (env?.android) {
-		return 'android';
-	}
-
-	if (env?.ios) {
-		return 'ios';
-	}
-
-	throw new Error('You need to provide a target platform!');
-}
diff --git a/packages/webpack5/src/configuration/vue.ts b/packages/webpack5/src/configuration/vue.ts
index a2134ac03..aa0804314 100644
--- a/packages/webpack5/src/configuration/vue.ts
+++ b/packages/webpack5/src/configuration/vue.ts
@@ -3,12 +3,16 @@ import Config from 'webpack-chain';
 import { VueLoaderPlugin } from 'vue-loader';
 import { env as _env, IWebpackEnv } from '../index';
 import { merge } from 'webpack-merge';
+import { getPlatform } from '../helpers/project';
 
 export default function (config: Config, env: IWebpackEnv = _env): Config {
 	base(config, env);
 
+	const platform = getPlatform();
+
 	// resolve .vue files
-	config.resolve.extensions.prepend('.vue');
+	// the order is reversed because we are using prepend!
+	config.resolve.extensions.prepend('.vue').prepend(`.${platform}.vue`);
 
 	// add a rule for .vue files
 	config.module
diff --git a/packages/webpack5/src/helpers/project.ts b/packages/webpack5/src/helpers/project.ts
index 5f471acf1..628b200b0 100644
--- a/packages/webpack5/src/helpers/project.ts
+++ b/packages/webpack5/src/helpers/project.ts
@@ -1,4 +1,4 @@
-import { env } from '../index';
+import { env, Platform } from '../index';
 import { resolve, basename } from 'path';
 
 export function getProjectRootPath(): string {
@@ -33,6 +33,19 @@ export function getDistPath() {
 	// 3rd party platforms would be treated the same
 }
 
+export function getPlatform(): Platform {
+	if (env?.android) {
+		return 'android';
+	}
+
+	if (env?.ios) {
+		return 'ios';
+	}
+
+	// todo: maybe no throw?
+	throw new Error('You need to provide a target platform!');
+}
+
 interface IPackageJson {
 	main?: string;
 	dependencies?: {