chore(compiler): disabled devtools by default and turn on config

packages/compiler/shared/merge-deep.ts

@@ -0,0 +1,35 @@
+// Copied from ui/src/utils/merge-deep.ts
+
+const isObject = (obj: any) => obj && typeof obj === 'object' && !Array.isArray(obj)
+
+/**
+ * Merge objects deep
+ * If property is array, it will replace target value
+ */
+export const mergeDeep = (target: any, source: any): any => {
+  if (!isObject(target)) {
+    target = {}
+  }
+
+  Object.keys(source).forEach(key => {
+    const targetValue = target[key]
+    const sourceValue = source[key]
+
+    if (sourceValue instanceof RegExp || sourceValue instanceof Date) {
+      target[key] = sourceValue
+    } else if (isObject(targetValue) && isObject(sourceValue)) {
+      target[key] = mergeDeep(Object.create(
+        Object.getPrototypeOf(targetValue),
+        Object.getOwnPropertyDescriptors(targetValue),
+      ), sourceValue)
+    } else {
+      target[key] = sourceValue
+    }
+  })
+
+  return target
+}
+
+export const mergeDeepMultiple = (...objects: any[]): any => {
+  return objects.reduce((acc, obj) => mergeDeep(acc, obj), {})
+}

packages/compiler/vite-plugin/index.ts

@@ -2,6 +2,7 @@ import { createLogger, Plugin } from "vite"
 import { devtools, PluginOptions as DevtoolsPluginOptions } from "../devtools"
 import { cssLayers } from "../css-layers"
 import { vuesticConfig, Options as VuesticConfigPluginOptions } from "../vuestic-config"
+import { mergeDeep } from "../shared/merge-deep"
 
 type Options = {
   /** @default true */
@@ -40,7 +41,17 @@ const logger = createLogger('info', {
   prefix: '[vuestic:compiler]'
 })
 
+const defaultOptions: Required<Options> = {
+  devtools: false,
+  cssLayers: false,
+  config: {
+    configPath: 'vuestic.config.ts'
+  },
+}
+
 export const vuestic = (options: Options = {}): Plugin[] => {
+  options = mergeDeep(defaultOptions, options)
+
   const extractOptions = (key: keyof Options) => {
     // Build fails without as Record<string, string> cast
     return typeof options[key] === 'object' ? options[key] as Record<string, string> : undefined
@@ -55,7 +66,7 @@ export const vuestic = (options: Options = {}): Plugin[] => {
     plugins.push(devtools(extractOptions('devtools')))
   }
 
-  if (options.cssLayers === true) {
+  if (options.cssLayers !== false) {
     logger.info('Using vuestic:css-layers', {
       timestamp: true,
     })

packages/docs/page-config/compiler/devtools/index.ts

@@ -25,7 +25,9 @@ import { vuestic } from '@vuestic/compiler/vite'
 
 export default defineConfig({
   plugins: [
-    vuestic(),
+    vuestic({
+      devtools: true,
+    }),
     vue(),
   ],
 })

packages/docs/page-config/compiler/vuestic-config/index.ts

@@ -34,9 +34,7 @@ import { vuestic } from '@vuestic/compiler/vite'
 
 export default defineConfig({
   plugins: [
-    vuestic({
-      config: true,
-    }),
+    vuestic(),
     vue(),
   ],
 })