Admin-ui styling is broken vendure 2.2.o-next.6

[tianyingchun]

Expected behavior

Environment (please complete the following information):

• @vendure/core version: 2.2.0-beta
• Nodejs version: 20
• Database (mysql/postgres etc):mysql

Additional context
no console error, it seems that missed some styles

[michaelbromley]

Delete your admin ui dir and any angular cache dir and rebuild.

[tianyingchun]

yes i have rebuild the issue also

  AdminUiPlugin.init({
      port: 3002,
      route: 'oldAdmin',
      adminUiConfig: {
        brand: 'wedglam',
        hideVendureBranding: false,
        hideVersion: false,
      },
      app: {
        path: getDirname(import.meta.url, '../../admin-ui-vendure/dist'),
      },
    }),

the compile scripts

import {
  compileUiExtensions,
  setBranding,
} from '@vendure/ui-devkit/compiler/index.js';
import { getDirname } from './get-dir-name.js';

export const compileAdmin = () => {
  return compileUiExtensions({
    outputPath: getDirname(import.meta.url, '../vendure-admin-ui'),
    extensions: [
      setBranding({
        // The small logo appears in the top left of the screen
        smallLogoPath: getDirname(import.meta.url, '../theme/logo.png'),
        // The large logo is used on the login page
        largeLogoPath: getDirname(import.meta.url, '../theme/logo.png'),
        // Favicon path.
        faviconPath: getDirname(import.meta.url, '../theme/favicon.ico'),
      }),
      {
        globalStyles: getDirname(import.meta.url, '../theme/theme.scss'),
      },
    ],
  });
};

import { existsSync, rmSync } from 'fs';
import { mergeDirs } from '@armit/file-utility';
import { compileAdmin } from './compile-admin-ui.js';
import { getDirname } from './get-dir-name.js';

const adminUIDir = `vendure-admin-ui`;
const from = getDirname(import.meta.url, '../', adminUIDir, 'dist');

const copyFiles = () => {
  const dist = getDirname(import.meta.url, '../../admin-ui-vendure/dist');
  if (existsSync(dist)) {
    rmSync(dist, { recursive: true });
  }
  mergeDirs(from, dist, 'overwrite');
};

compileAdmin()
  .compile?.()
  .then((result) => {
    copyFiles();
    console.log(result);
    process.exit(0);
  })
  .catch((err) => {
    console.log(err);
  });

[tianyingchun]

Delete your admin ui dir and any angular cache dir and rebuild.

where is angular cache dir?

[tianyingchun]

i have delete all node_modules, reinstall , rebuild, restart server, build sucecss

but start server admin-ui seems that lose some framework style.

BTW all interaction functionality works fine, only style issue here

[michaelbromley]

The Angular compiler with create a .angular directory and cache builds there.

Also delete the outputPath: getDirname(import.meta.url, '../vendure-admin-ui'), directory.

[tianyingchun]

../vendure-admin-ui has been deleted, no .angular cache in project found.

[tianyingchun]

oh, it seems that dark theme is broken, cause of i have dark theme