diff --git a/modules/cms/console/CreateTheme.php b/modules/cms/console/CreateTheme.php
index 29a5f91966..71a8036f66 100644
--- a/modules/cms/console/CreateTheme.php
+++ b/modules/cms/console/CreateTheme.php
@@ -35,6 +35,11 @@ class CreateTheme extends GeneratorCommand
*/
protected $nameFrom = 'theme';
+ /**
+ * @var string The scaffold that we are building
+ */
+ protected string $scaffold;
+
/**
* @var array Available theme scaffolds and their types
*/
@@ -68,12 +73,9 @@ class CreateTheme extends GeneratorCommand
'scaffold/theme/tailwind/partials/site/header.stub' => 'partials/site/header.htm',
'scaffold/theme/tailwind/partials/site/footer.stub' => 'partials/site/footer.htm',
'scaffold/theme/tailwind/.gitignore.stub' => '.gitignore',
- 'scaffold/theme/tailwind/package.stub' => 'package.json',
'scaffold/theme/tailwind/README.stub' => 'README.md',
- 'scaffold/theme/tailwind/tailwind.config.stub' => 'tailwind.config.js',
'scaffold/theme/tailwind/theme.stub' => 'theme.yaml',
'scaffold/theme/tailwind/version.stub' => 'version.yaml',
- 'scaffold/theme/tailwind/winter.mix.stub' => 'winter.mix.js',
],
];
@@ -90,12 +92,13 @@ protected function getNameInput(): string
*/
protected function prepareVars(): array
{
- $scaffold = $this->argument('scaffold') ?? 'tailwind';
+ $this->scaffold = $this->argument('scaffold') ?? 'tailwind';
+
$validOptions = $this->suggestScaffoldValues();
- if (!in_array($scaffold, $validOptions)) {
- throw new InvalidArgumentException("$scaffold is not an available theme scaffold type (Available types: " . implode(', ', $validOptions) . ')');
+ if (!in_array($this->scaffold, $validOptions)) {
+ throw new InvalidArgumentException("$this->scaffold is not an available theme scaffold type (Available types: " . implode(', ', $validOptions) . ')');
}
- $this->stubs = $this->themeScaffolds[$scaffold];
+ $this->stubs = $this->themeScaffolds[$this->scaffold];
return [
'code' => $this->getNameInput(),
@@ -146,4 +149,39 @@ public function makeStub($stubName)
$this->files->put($destinationFile, $destinationContent);
}
+
+ public function makeStubs(): void
+ {
+ parent::makeStubs();
+
+ if ($this->scaffold === 'tailwind') {
+ // Set up the vite config files
+ $this->call('vite:create', [
+ 'packageName' => 'theme-' . $this->getNameInput(),
+ '--no-interaction' => true,
+ '--force' => true,
+ '--silent' => true,
+ '--tailwind' => true
+ ]);
+
+ $this->info('Installing NPM dependencies...');
+
+ // Ensure all require packages are available for the new theme and add the new theme to our npm workspaces
+ $this->call('vite:install', [
+ 'assetPackage' => ['theme-' . $this->getNameInput()],
+ '--no-interaction' => true,
+ '--silent' => true,
+ '--disable-tty' => true
+ ]);
+
+ $this->info('Compiling your theme...');
+
+ // Run an initial compile to ensure styles are available for first load
+ $this->call('vite:compile', [
+ '--package' => ['theme-' . $this->getNameInput()],
+ '--no-interaction' => true,
+ '--silent' => true,
+ ]);
+ }
+ }
}
diff --git a/modules/cms/console/scaffold/theme/tailwind/package.stub b/modules/cms/console/scaffold/theme/tailwind/package.stub
deleted file mode 100644
index 51ba79a043..0000000000
--- a/modules/cms/console/scaffold/theme/tailwind/package.stub
+++ /dev/null
@@ -1,12 +0,0 @@
-{
- "name": "{{code}}",
- "private": true,
- "version": "1.0.0",
- "devDependencies": {
- "postcss": "~8.4.x",
- "postcss-import": "~14.1.x",
- "tailwindcss": "~3.0.x"
- },
- "dependencies": {
- }
-}
diff --git a/modules/cms/console/scaffold/theme/tailwind/partials/meta/styles.stub b/modules/cms/console/scaffold/theme/tailwind/partials/meta/styles.stub
index fdcc745eab..154e01dcc7 100644
--- a/modules/cms/console/scaffold/theme/tailwind/partials/meta/styles.stub
+++ b/modules/cms/console/scaffold/theme/tailwind/partials/meta/styles.stub
@@ -1,19 +1,5 @@
==
-find('dist/css/theme.css');
- if ($styles) {
- $this['lastmodified'] = $styles->mtime;
- } else {
- throw new \Exception("Asset files were not detected, try running artisan mix:install && artisan mix:compile -p theme-{{code}}");
- }
-}
-?>
-==
-
+{{ vite(['assets/src/css/theme-{{code}}.css'], 'theme-{{code}}') }}