create-qwik 1.1.5-dev20230624194124 → 1.1.5-dev20230625145153

package/index.cjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * create-qwik 1.1.5-dev20230624194124
+ * create-qwik 1.1.5-dev20230625145153
  * Copyright Builder.io, Inc. All Rights Reserved.
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://github.com/BuilderIO/qwik/blob/main/LICENSE
@@ -88,7 +88,7 @@ ${T("\u251C"+"\u2500".repeat(r+2)+"\u256F")}
 `))}if(!n){let a=`${ou(` ${e} install failed `)}
  You might need to run ${S(`"${e} install"`)} manually inside the root of the project.
 
-`;B.error(a)}return n}}}function tr(e){let t="create-qwik-"+Math.round(Math.random()*Number.MAX_SAFE_INTEGER).toString(36).toLowerCase(),D=j.default.join(Mt.default.tmpdir(),t);try{q.default.mkdirSync(D)}catch(i){B.error(`\u274C ${x(String(i))}`)}let r=j.default.join(e.dir,"package.json"),s=j.default.join(D,"package.json");return q.default.copyFileSync(r,s),{tmpInstallDir:D}}var b=y(require("fs"),1),tu=require("path");async function ee(e,t,D,r){let s=await b.default.promises.readdir(D);await Promise.all(s.map(async i=>{let u=i==="gitignore"?".gitignore":i,n=(0,tu.extname)(u),a=(0,tu.join)(D,i),c=(0,tu.join)(r,u),p=await b.default.promises.stat(a);p.isDirectory()?await ee(e,t,a,c):p.isFile()&&(u==="package.json"?await Dr(e,a,c):u==="README.md"?await sr(e,a,c):u===".gitignore"?await ir(e,a,c):n===".css"?await nr(e,a,c):b.default.existsSync(c)?e.files.push({path:c,content:await b.default.promises.readFile(a,"utf-8"),type:"overwrite"}):e.files.push({path:c,content:await b.default.promises.readFile(a),type:"create"}))}))}async function Dr(e,t,D){var u;let r=await b.default.promises.readFile(t,"utf-8"),s=JSON.parse(r),i=["scripts","dependencies","devDependencies"];try{let n=JSON.parse(await b.default.promises.readFile(D,"utf-8"));if(i.forEach(a=>{rr(s,n,a)}),(u=n.scripts)!=null&&u.qwik){let a=n.scripts.qwik;delete n.scripts.qwik,n.scripts.qwik=a}e.files.push({path:D,content:JSON.stringify(n,null,2)+`
+`;B.error(a)}return n}}}function tr(e){let t="create-qwik-"+Math.round(Math.random()*Number.MAX_SAFE_INTEGER).toString(36).toLowerCase(),D=j.default.join(Mt.default.tmpdir(),t);try{q.default.mkdirSync(D)}catch(i){B.error(`\u274C ${x(String(i))}`)}let r=j.default.join(e.dir,"package.json"),s=j.default.join(D,"package.json");return q.default.copyFileSync(r,s),{tmpInstallDir:D}}var b=y(require("fs"),1),tu=require("path");async function ee(e,t,D,r){let s=await b.default.promises.readdir(D);await Promise.all(s.map(async i=>{let u=i==="gitignore"?".gitignore":i,n=(0,tu.extname)(u),a=(0,tu.join)(D,i),c=(0,tu.join)(r,u),p=await b.default.promises.stat(a);p.isDirectory()?await ee(e,t,a,c):p.isFile()&&(u==="package.json"?await Dr(e,a,c):u==="README.md"?await sr(e,a,c):u===".gitignore"||u===".prettierignore"||u===".eslintignore"?await ir(e,a,c):n===".css"?await nr(e,a,c):b.default.existsSync(c)?e.files.push({path:c,content:await b.default.promises.readFile(a),type:"overwrite"}):e.files.push({path:c,content:await b.default.promises.readFile(a),type:"create"}))}))}async function Dr(e,t,D){var u;let r=await b.default.promises.readFile(t,"utf-8"),s=JSON.parse(r),i=["scripts","dependencies","devDependencies"];try{let n=JSON.parse(await b.default.promises.readFile(D,"utf-8"));if(i.forEach(a=>{rr(s,n,a)}),(u=n.scripts)!=null&&u.qwik){let a=n.scripts.qwik;delete n.scripts.qwik,n.scripts.qwik=a}e.files.push({path:D,content:JSON.stringify(n,null,2)+`
 `,type:"modify"})}catch{e.files.push({path:D,content:r,type:"create"})}}function rr(e,t,D){if(e[D]){t[D]?Object.assign(t[D],{...e[D]}):t[D]={...e[D]};let r={},s=Object.keys(t[D]).sort();for(let i of s)r[i]=t[D][i];t[D]=r}}async function sr(e,t,D){let r=await b.default.promises.readFile(t,"utf-8"),s,i="";try{i=await b.default.promises.readFile(D,"utf-8"),i=i.trim()+`
 
 `+r,s="modify"}catch{i=r,s="create"}let u=N();u!=="npm"&&(i=i.replace(/npm run/g,u)),e.files.push({path:D,content:i.trim()+`
@@ -99,4 +99,4 @@ ${T("\u251C"+"\u2500".repeat(r+2)+"\u256F")}
 `+s.trim()+`
 `;e.files.push({path:D,content:i,type:"modify"})}catch{e.files.push({path:D,content:r,type:"create"})}}async function De(e,t){let r=(await K()).find(n=>n.id===t.integration);if(!r)throw new Error(`Unable to find integration "${t.integration}"`);let s={files:[],installedDeps:{},installedScripts:Object.keys(r.pkgJson.scripts||{})};t.installDeps&&(s.installedDeps={...r.pkgJson.dependencies,...r.pkgJson.devDependencies}),await ee(s,t,r.dir,t.rootDir);let i=async n=>{let a=Object.keys(s.installedDeps).length>0,c=hu();n&&c.start(`Updating app${a?" and installing dependencies":""}...`);let p=!0;try{let l=new Set(s.files.map(C=>(0,qt.dirname)(C.path)));for(let C of Array.from(l))try{te.default.mkdirSync(C,{recursive:!0})}catch{}let F=Promise.all(s.files.map(async C=>{await te.default.promises.writeFile(C.path,C.content)}));if(t.installDeps&&Object.keys(s.installedDeps).length>0){let{install:C}=eu(e,t.rootDir);p=await C}if(await F,n&&c.stop("App updated"),!p){let C=`${ou(` ${e} install failed `)}
  You might need to run "${S(`${e} install`)}" manually inside the root of the project.`;B.error(C)}}catch(l){n&&c.stop("App updated"),U(String(l))}};return{rootDir:t.rootDir,integration:r,updates:s,commit:i}}var Vt=y(require("os"));async function re(e,t){or()?t=process.cwd():(t=ie(t),Du.default.existsSync(t)&&U(`Directory "${t}" already exists. Please either remove this directory, or choose another location.`));let D=N(),s=await ru({starterId:e,outDir:t});return se(D,s,!1),s}function se(e,t,D){let r=process.cwd()===t.outDir,s=(0,_.relative)(process.cwd(),t.outDir),i=[];r?i.push(`\u{1F984} ${$u(" Success! ")}`):i.push(`\u{1F984} ${$u(" Success! ")} ${S("Project created in")} ${Ce(k(s))} ${S("directory")}`),i.push(""),i.push(`\u{1F430} ${S("Next steps:")}`),r||i.push(`   cd ${s}`),D||i.push(`   ${e} install`),i.push(`   ${e} start`),i.push("");let u=e!=="npm"?`${e} qwik add`:"npm run qwik add";return i.push(`\u{1F90D} ${S("Integrations? Add Netlify, Cloudflare, Tailwind...")}`),i.push(`   ${u}`),i.push(""),i.push(Rt(t.docs)),i.push(`\u{1F440} ${S("Presentations, Podcasts and Videos:")}`),i.push("   https://qwik.builder.io/media/"),i.push(""),i.join(`
-`)}async function ru(e){let t=N();if(!Lt(e.starterId))throw new Error("Missing starter id");if(!Lt(e.outDir))throw new Error("Missing outDir");if(!(0,_.isAbsolute)(e.outDir))throw new Error("outDir must be an absolute path");Du.default.existsSync(e.outDir)||Du.default.mkdirSync(decodeURIComponent(e.outDir),{recursive:!0});let D={starterId:e.starterId,outDir:e.outDir,docs:[]},r=(await K()).filter(i=>i.type==="app");if(e.starterId==="library"){let i=r.find(u=>u.id==="library");if(!i)throw new Error("Unable to find base app");await Wt(t,D,i)}else{let i=r.find(n=>n.id==="base");if(!i)throw new Error("Unable to find base app");let u=r.find(n=>n.id===e.starterId);if(!u)throw new Error(`Invalid starter id "${e.starterId}". It can only be one of${r.map(n=>` "${n.id}"`)}.`);await Wt(t,D,i,u)}return D}async function Wt(e,t,D,r){t.docs.push(...D.docs);let s=r??D,i=Ot({...D.pkgJson,name:`my-${s.pkgJson.name}`,description:s.pkgJson.description,scripts:void 0,dependencies:void 0,devDependencies:void 0});await It(t.outDir,i);let u=(0,_.join)(t.outDir,"README.md");await Du.default.promises.writeFile(u,""),await(await De(e,{rootDir:t.outDir,integration:D.id,installDeps:!1})).commit(!1),r&&(t.docs.push(...r.docs),await(await De(e,{rootDir:t.outDir,integration:r.id,installDeps:!1})).commit(!1))}function Lt(e){return typeof e=="string"&&e.trim().length>0}function ie(e){return e.startsWith("~/")?(0,_.resolve)(Vt.default.homedir(),e):(0,_.resolve)(process.cwd(),e)}function or(){return ar()}function ar(){try{return process.cwd().startsWith("/home/projects/")}catch{}return!1}var Y=y(require("fs")),su=require("path");async function ne(){Pe(`Let's create a ${fu(" Qwik App ")} \u2728 (v1.1.5-dev20230624194124)`),await jt(500);let e="./qwik-app",t=await Te({message:`Where would you like to create your new project? ${T("(Use '.' or './' for current directory)")}`,placeholder:e})||e;M(t)&&(uu("Operation cancelled."),process.exit(0));let D=N(),s=(await K()).filter($=>$.type==="app"),i=s.find($=>$.id==="base"),u=s.filter($=>$.id!==i.id),n=Nt(D,i),a=ie(t.trim());B.info(`Creating new project in ${fu(" "+a+" ")} ... \u{1F407}`);let c=null;if(Y.default.existsSync(a)&&Y.default.readdirSync(a).length>0){let $=await qu({message:`Directory "./${(0,su.relative)(process.cwd(),a)}" already exists and is not empty. What would you like to do?`,options:[{value:"exit",label:"Do not overwrite this directory and exit"},{value:"replace",label:"Remove contents of this directory"}]});(M($)||$==="exit")&&(uu("Operation cancelled."),process.exit(0)),$==="replace"&&(c=Y.default.promises.readdir(a).then(W=>Promise.all(W.map(Jt=>Y.default.promises.rm((0,su.join)(a,Jt),{recursive:!0})))))}let p=await qu({message:"Select a starter",options:u.map($=>{var W;return{label:$.name,value:$.id,hint:(W=$.pkgJson)==null?void 0:W.description}})});M(p)&&(uu("Operation cancelled."),process.exit(0));let l=p,F=await Nu({message:`Would you like to install ${D} dependencies?`,initialValue:!0});M(F)&&(uu("Operation cancelled."),process.exit(0));let C=await Nu({message:"Initialize a new git repository?",initialValue:!0});c&&await c;let w=F;w||n.abort();let R={starterId:l,outDir:a},O=hu();O.start("Creating App...");let iu=await ru(R);if(O.stop("App Created \u{1F430}"),C)if(Y.default.existsSync((0,su.join)(a,".git")))B.info("Git has already been initialized before. Skipping...");else{O.start("Git initializing...");try{let $=[];if($.push(await G("git",["init"],a).install),$.push(await G("git",["add","-A"],a).install),$.push(await G("git",["commit","-m","Initial commit \u26A1\uFE0F"],a).install),$.some(W=>W===!1))throw"";O.stop("Git initialized \u{1F3B2}")}catch{O.stop("Git failed to initialize"),B.error(x("Git failed to initialize. You can do this manually by running: git init"))}}let H=!1;return w&&(O.start(`Installing ${D} dependencies...`),H=await n.complete(iu.outDir),H&&(H=await eu(D,iu.outDir).install),O.stop(`${H?"Installed":"Failed to install"} ${D} dependencies \u{1F4CB}`)),Pt(se(D,iu,H),"Result"),Wu("Happy coding! \u{1F407}"),iu}async function cr(){console.clear(),Tt(),lr();try{let e=process.argv.slice(2);e.length>=2?await re(e[0],e[1]):await ne()}catch(e){U(e.message||e)}}function lr(){let e=process.version,[t,D]=e.replace("v","").split(".");Number(t)<16?(console.error(x(`Qwik requires Node.js 16.8 or higher. You are currently running Node.js ${e}.`)),process.exit(1)):Number(t)===16?Number(D)<8&&console.warn(me(`Node.js 16.8 or higher is recommended. You are currently running Node.js ${e}.`)):Number(t)===18&&Number(D)<11&&console.error(x(`Node.js 18.11 or higher is REQUIRED. From Node 18.0.0 to 18.11.0, there is a bug preventing correct behaviour of Qwik. You are currently running Node.js ${e}. https://github.com/BuilderIO/qwik/issues/3035`))}0&&(module.exports={createApp,runCli,runCreateCli,runCreateInteractiveCli});
+`)}async function ru(e){let t=N();if(!Lt(e.starterId))throw new Error("Missing starter id");if(!Lt(e.outDir))throw new Error("Missing outDir");if(!(0,_.isAbsolute)(e.outDir))throw new Error("outDir must be an absolute path");Du.default.existsSync(e.outDir)||Du.default.mkdirSync(decodeURIComponent(e.outDir),{recursive:!0});let D={starterId:e.starterId,outDir:e.outDir,docs:[]},r=(await K()).filter(i=>i.type==="app");if(e.starterId==="library"){let i=r.find(u=>u.id==="library");if(!i)throw new Error("Unable to find base app");await Wt(t,D,i)}else{let i=r.find(n=>n.id==="base");if(!i)throw new Error("Unable to find base app");let u=r.find(n=>n.id===e.starterId);if(!u)throw new Error(`Invalid starter id "${e.starterId}". It can only be one of${r.map(n=>` "${n.id}"`)}.`);await Wt(t,D,i,u)}return D}async function Wt(e,t,D,r){t.docs.push(...D.docs);let s=r??D,i=Ot({...D.pkgJson,name:`my-${s.pkgJson.name}`,description:s.pkgJson.description,scripts:void 0,dependencies:void 0,devDependencies:void 0});await It(t.outDir,i);let u=(0,_.join)(t.outDir,"README.md");await Du.default.promises.writeFile(u,""),await(await De(e,{rootDir:t.outDir,integration:D.id,installDeps:!1})).commit(!1),r&&(t.docs.push(...r.docs),await(await De(e,{rootDir:t.outDir,integration:r.id,installDeps:!1})).commit(!1))}function Lt(e){return typeof e=="string"&&e.trim().length>0}function ie(e){return e.startsWith("~/")?(0,_.resolve)(Vt.default.homedir(),e):(0,_.resolve)(process.cwd(),e)}function or(){return ar()}function ar(){try{return process.cwd().startsWith("/home/projects/")}catch{}return!1}var Y=y(require("fs")),su=require("path");async function ne(){Pe(`Let's create a ${fu(" Qwik App ")} \u2728 (v1.1.5-dev20230625145153)`),await jt(500);let e="./qwik-app",t=await Te({message:`Where would you like to create your new project? ${T("(Use '.' or './' for current directory)")}`,placeholder:e})||e;M(t)&&(uu("Operation cancelled."),process.exit(0));let D=N(),s=(await K()).filter($=>$.type==="app"),i=s.find($=>$.id==="base"),u=s.filter($=>$.id!==i.id),n=Nt(D,i),a=ie(t.trim());B.info(`Creating new project in ${fu(" "+a+" ")} ... \u{1F407}`);let c=null;if(Y.default.existsSync(a)&&Y.default.readdirSync(a).length>0){let $=await qu({message:`Directory "./${(0,su.relative)(process.cwd(),a)}" already exists and is not empty. What would you like to do?`,options:[{value:"exit",label:"Do not overwrite this directory and exit"},{value:"replace",label:"Remove contents of this directory"}]});(M($)||$==="exit")&&(uu("Operation cancelled."),process.exit(0)),$==="replace"&&(c=Y.default.promises.readdir(a).then(W=>Promise.all(W.map(Jt=>Y.default.promises.rm((0,su.join)(a,Jt),{recursive:!0})))))}let p=await qu({message:"Select a starter",options:u.map($=>{var W;return{label:$.name,value:$.id,hint:(W=$.pkgJson)==null?void 0:W.description}})});M(p)&&(uu("Operation cancelled."),process.exit(0));let l=p,F=await Nu({message:`Would you like to install ${D} dependencies?`,initialValue:!0});M(F)&&(uu("Operation cancelled."),process.exit(0));let C=await Nu({message:"Initialize a new git repository?",initialValue:!0});c&&await c;let w=F;w||n.abort();let R={starterId:l,outDir:a},O=hu();O.start("Creating App...");let iu=await ru(R);if(O.stop("App Created \u{1F430}"),C)if(Y.default.existsSync((0,su.join)(a,".git")))B.info("Git has already been initialized before. Skipping...");else{O.start("Git initializing...");try{let $=[];if($.push(await G("git",["init"],a).install),$.push(await G("git",["add","-A"],a).install),$.push(await G("git",["commit","-m","Initial commit \u26A1\uFE0F"],a).install),$.some(W=>W===!1))throw"";O.stop("Git initialized \u{1F3B2}")}catch{O.stop("Git failed to initialize"),B.error(x("Git failed to initialize. You can do this manually by running: git init"))}}let H=!1;return w&&(O.start(`Installing ${D} dependencies...`),H=await n.complete(iu.outDir),H&&(H=await eu(D,iu.outDir).install),O.stop(`${H?"Installed":"Failed to install"} ${D} dependencies \u{1F4CB}`)),Pt(se(D,iu,H),"Result"),Wu("Happy coding! \u{1F407}"),iu}async function cr(){console.clear(),Tt(),lr();try{let e=process.argv.slice(2);e.length>=2?await re(e[0],e[1]):await ne()}catch(e){U(e.message||e)}}function lr(){let e=process.version,[t,D]=e.replace("v","").split(".");Number(t)<16?(console.error(x(`Qwik requires Node.js 16.8 or higher. You are currently running Node.js ${e}.`)),process.exit(1)):Number(t)===16?Number(D)<8&&console.warn(me(`Node.js 16.8 or higher is recommended. You are currently running Node.js ${e}.`)):Number(t)===18&&Number(D)<11&&console.error(x(`Node.js 18.11 or higher is REQUIRED. From Node 18.0.0 to 18.11.0, there is a bug preventing correct behaviour of Qwik. You are currently running Node.js ${e}. https://github.com/BuilderIO/qwik/issues/3035`))}0&&(module.exports={createApp,runCli,runCreateCli,runCreateInteractiveCli});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-qwik",
-  "version": "1.1.5-dev20230624194124",
+  "version": "1.1.5-dev20230625145153",
   "description": "Interactive CLI for create Qwik projects and adding features.",
   "bin": "./create-qwik.cjs",
   "main": "./index.cjs",

package/starters/apps/base/.eslintrc.cjs

@@ -6,37 +6,37 @@ module.exports = {
     node: true,
   },
   extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:qwik/recommended',
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:qwik/recommended",
   ],
-  parser: '@typescript-eslint/parser',
+  parser: "@typescript-eslint/parser",
   parserOptions: {
     tsconfigRootDir: __dirname,
-    project: ['./tsconfig.json'],
+    project: ["./tsconfig.json"],
     ecmaVersion: 2021,
-    sourceType: 'module',
+    sourceType: "module",
     ecmaFeatures: {
       jsx: true,
     },
   },
-  plugins: ['@typescript-eslint'],
+  plugins: ["@typescript-eslint"],
   rules: {
-    '@typescript-eslint/no-explicit-any': 'off',
-    '@typescript-eslint/explicit-module-boundary-types': 'off',
-    '@typescript-eslint/no-inferrable-types': 'off',
-    '@typescript-eslint/no-non-null-assertion': 'off',
-    '@typescript-eslint/no-empty-interface': 'off',
-    '@typescript-eslint/no-namespace': 'off',
-    '@typescript-eslint/no-empty-function': 'off',
-    '@typescript-eslint/no-this-alias': 'off',
-    '@typescript-eslint/ban-types': 'off',
-    '@typescript-eslint/ban-ts-comment': 'off',
-    'prefer-spread': 'off',
-    'no-case-declarations': 'off',
-    'no-console': 'off',
-    '@typescript-eslint/no-unused-vars': ['error'],
-    '@typescript-eslint/consistent-type-imports': 'warn',
-    '@typescript-eslint/no-unnecessary-condition': 'warn',
+    "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/no-inferrable-types": "off",
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/no-empty-interface": "off",
+    "@typescript-eslint/no-namespace": "off",
+    "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/no-this-alias": "off",
+    "@typescript-eslint/ban-types": "off",
+    "@typescript-eslint/ban-ts-comment": "off",
+    "prefer-spread": "off",
+    "no-case-declarations": "off",
+    "no-console": "off",
+    "@typescript-eslint/no-unused-vars": ["error"],
+    "@typescript-eslint/consistent-type-imports": "warn",
+    "@typescript-eslint/no-unnecessary-condition": "warn",
   },
 };

package/starters/apps/base/package.json

@@ -16,13 +16,13 @@
     "qwik": "qwik"
   },
   "devDependencies": {
-    "@builder.io/qwik": "1.1.5-dev20230624194124",
-    "@builder.io/qwik-city": "1.1.5-dev20230624194124",
+    "@builder.io/qwik": "1.1.5-dev20230625145153",
+    "@builder.io/qwik-city": "1.1.5-dev20230625145153",
     "@types/eslint": "8.40.2",
     "@types/node": "^20.3.1",
     "@typescript-eslint/eslint-plugin": "5.60.0",
     "@typescript-eslint/parser": "5.60.0",
-    "eslint-plugin-qwik": "1.1.5-dev20230624194124",
+    "eslint-plugin-qwik": "1.1.5-dev20230625145153",
     "eslint": "8.43.0",
     "undici": "5.22.1",
     "prettier": "2.8.8",

package/starters/apps/base/src/entry.dev.tsx

@@ -9,8 +9,8 @@
  * - More code is transferred to the browser than in SSR mode.
  * - Optimizer/Serialization/Deserialization code is not exercised!
  */
-import { render, type RenderOptions } from '@builder.io/qwik';
-import Root from './root';
+import { render, type RenderOptions } from "@builder.io/qwik";
+import Root from "./root";
 
 export default function (opts: RenderOptions) {
   return render(document, <Root />, opts);

package/starters/apps/base/src/entry.preview.tsx

@@ -10,9 +10,9 @@
  * - https://vitejs.dev/config/preview-options.html#preview-options
  *
  */
-import { createQwikCity } from '@builder.io/qwik-city/middleware/node';
-import qwikCityPlan from '@qwik-city-plan';
-import render from './entry.ssr';
+import { createQwikCity } from "@builder.io/qwik-city/middleware/node";
+import qwikCityPlan from "@qwik-city-plan";
+import render from "./entry.ssr";
 
 /**
  * The default export is the QwikCity adapter used by Vite preview.

package/starters/apps/base/src/entry.ssr.tsx

@@ -10,9 +10,12 @@
  * - npm run build
  *
  */
-import { renderToStream, type RenderToStreamOptions } from '@builder.io/qwik/server';
-import { manifest } from '@qwik-client-manifest';
-import Root from './root';
+import {
+  renderToStream,
+  type RenderToStreamOptions,
+} from "@builder.io/qwik/server";
+import { manifest } from "@qwik-client-manifest";
+import Root from "./root";
 
 export default function (opts: RenderToStreamOptions) {
   return renderToStream(<Root />, {
@@ -20,7 +23,7 @@ export default function (opts: RenderToStreamOptions) {
     ...opts,
     // Use container attributes to set attributes on the html tag.
     containerAttributes: {
-      lang: 'en-us',
+      lang: "en-us",
       ...opts.containerAttributes,
     },
   });

package/starters/apps/base/src/global.css

@@ -10,9 +10,9 @@ html {
   -moz-tab-size: 4;
   -o-tab-size: 4;
   tab-size: 4;
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
-    'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
-    'Segoe UI Symbol', 'Noto Color Emoji';
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }
 
 body {

package/starters/apps/base/src/routes/service-worker.ts

@@ -7,11 +7,11 @@
  * Qwik uses a service worker to speed up your site and reduce latency, ie, not used in the traditional way of offline.
  * You can also use this file to add more functionality that runs in the service worker.
  */
-import { setupServiceWorker } from '@builder.io/qwik-city/service-worker';
+import { setupServiceWorker } from "@builder.io/qwik-city/service-worker";
 
 setupServiceWorker();
 
-self.addEventListener('install', () => self.skipWaiting());
-self.addEventListener('activate', (ev) => ev.waitUntil(self.clients.claim()));
+self.addEventListener("install", () => self.skipWaiting());
+self.addEventListener("activate", (ev) => ev.waitUntil(self.clients.claim()));
 
 declare const self: ServiceWorkerGlobalScope;

package/starters/apps/base/vite.config.ts

@@ -1,14 +1,14 @@
-import { defineConfig } from 'vite';
-import { qwikVite } from '@builder.io/qwik/optimizer';
-import { qwikCity } from '@builder.io/qwik-city/vite';
-import tsconfigPaths from 'vite-tsconfig-paths';
+import { defineConfig } from "vite";
+import { qwikVite } from "@builder.io/qwik/optimizer";
+import { qwikCity } from "@builder.io/qwik-city/vite";
+import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig(() => {
   return {
     plugins: [qwikCity(), qwikVite(), tsconfigPaths()],
     preview: {
       headers: {
-        'Cache-Control': 'public, max-age=600',
+        "Cache-Control": "public, max-age=600",
       },
     },
   };

package/starters/apps/basic/src/components/router-head/router-head.tsx

@@ -1,5 +1,5 @@
-import { component$ } from '@builder.io/qwik';
-import { useDocumentHead, useLocation } from '@builder.io/qwik-city';
+import { component$ } from "@builder.io/qwik";
+import { useDocumentHead, useLocation } from "@builder.io/qwik-city";
 
 /**
  * The RouterHead component is placed inside of the document `<head>` element.

package/starters/apps/basic/src/components/starter/counter/counter.tsx

@@ -1,6 +1,6 @@
-import { component$, useSignal, $ } from '@builder.io/qwik';
-import styles from './counter.module.css';
-import Gauge from '../gauge';
+import { component$, useSignal, $ } from "@builder.io/qwik";
+import styles from "./counter.module.css";
+import Gauge from "../gauge";
 
 export default component$(() => {
   const count = useSignal(70);
@@ -13,12 +13,18 @@ export default component$(() => {
   });
 
   return (
-    <div class={styles['counter-wrapper']}>
-      <button class="button-dark button-small" onClick$={() => setCount(count.value - 1)}>
+    <div class={styles["counter-wrapper"]}>
+      <button
+        class="button-dark button-small"
+        onClick$={() => setCount(count.value - 1)}
+      >
         -
       </button>
       <Gauge value={count.value} />
-      <button class="button-dark button-small" onClick$={() => setCount(count.value + 1)}>
+      <button
+        class="button-dark button-small"
+        onClick$={() => setCount(count.value + 1)}
+      >
         +
       </button>
     </div>

package/starters/apps/basic/src/components/starter/footer/footer.tsx

@@ -1,6 +1,6 @@
-import { component$ } from '@builder.io/qwik';
-import { useServerTimeLoader } from '~/routes/layout';
-import styles from './footer.module.css';
+import { component$ } from "@builder.io/qwik";
+import { useServerTimeLoader } from "~/routes/layout";
+import styles from "./footer.module.css";
 
 export default component$(() => {
   const serverTime = useServerTimeLoader();

package/starters/apps/basic/src/components/starter/gauge/index.tsx

@@ -1,5 +1,5 @@
-import { component$ } from '@builder.io/qwik';
-import styles from './gauge.module.css';
+import { component$ } from "@builder.io/qwik";
+import styles from "./gauge.module.css";
 
 export default component$(({ value = 50 }: { value?: number }) => {
   const safeValue = value < 0 || value > 100 ? 50 : value;
@@ -14,7 +14,13 @@ export default component$(({ value = 50 }: { value?: number }) => {
           </linearGradient>
         </defs>
 
-        <circle r="56" cx="60" cy="60" stroke-width="8" style="fill: #000; stroke: #0000"></circle>
+        <circle
+          r="56"
+          cx="60"
+          cy="60"
+          stroke-width="8"
+          style="fill: #000; stroke: #0000"
+        ></circle>
 
         <circle
           r="56"

package/starters/apps/basic/src/components/starter/header/header.tsx

@@ -1,11 +1,11 @@
-import { component$ } from '@builder.io/qwik';
-import { QwikLogo } from '../icons/qwik';
-import styles from './header.module.css';
+import { component$ } from "@builder.io/qwik";
+import { QwikLogo } from "../icons/qwik";
+import styles from "./header.module.css";
 
 export default component$(() => {
   return (
     <header class={styles.header}>
-      <div class={['container', styles.wrapper]}>
+      <div class={["container", styles.wrapper]}>
         <div class={styles.logo}>
           <a href="/" title="qwik">
             <QwikLogo height={50} width={143} />
@@ -13,17 +13,26 @@ export default component$(() => {
         </div>
         <ul>
           <li>
-            <a href="https://qwik.builder.io/docs/components/overview/" target="_blank">
+            <a
+              href="https://qwik.builder.io/docs/components/overview/"
+              target="_blank"
+            >
               Docs
             </a>
           </li>
           <li>
-            <a href="https://qwik.builder.io/examples/introduction/hello-world/" target="_blank">
+            <a
+              href="https://qwik.builder.io/examples/introduction/hello-world/"
+              target="_blank"
+            >
               Examples
             </a>
           </li>
           <li>
-            <a href="https://qwik.builder.io/tutorial/welcome/overview/" target="_blank">
+            <a
+              href="https://qwik.builder.io/tutorial/welcome/overview/"
+              target="_blank"
+            >
               Tutorials
             </a>
           </li>

package/starters/apps/basic/src/components/starter/hero/hero.tsx

@@ -1,18 +1,18 @@
-import { component$ } from '@builder.io/qwik';
-import styles from './hero.module.css';
-import ImgThunder from '~/media/thunder.png?jsx';
+import { component$ } from "@builder.io/qwik";
+import styles from "./hero.module.css";
+import ImgThunder from "~/media/thunder.png?jsx";
 
 export default component$(() => {
   return (
-    <div class={['container', styles.hero]}>
-      <ImgThunder class={styles['hero-image']} />
+    <div class={["container", styles.hero]}>
+      <ImgThunder class={styles["hero-image"]} />
       <h1>
         So <span class="highlight">fantastic</span>
         <br />
         to have <span class="highlight">you</span> here
       </h1>
       <p>Have fun building your App with Qwik.</p>
-      <div class={styles['button-group']}>
+      <div class={styles["button-group"]}>
         <button
           onClick$={async () => {
             const defaults = {
@@ -21,7 +21,7 @@ export default component$(() => {
               gravity: 0,
               decay: 0.95,
               startVelocity: 30,
-              colors: ['006ce9', 'ac7ff4', '18b6f6', '713fc2', 'ffffff'],
+              colors: ["006ce9", "ac7ff4", "18b6f6", "713fc2", "ffffff"],
               origin: {
                 x: 0.5,
                 y: 0.35,
@@ -33,10 +33,11 @@ export default component$(() => {
                 if ((globalThis as any).confetti) {
                   return resolve((globalThis as any).confetti as any);
                 }
-                const script = document.createElement('script');
+                const script = document.createElement("script");
                 script.src =
-                  'https://cdn.jsdelivr.net/npm/canvas-confetti@1.5.1/dist/confetti.browser.min.js';
-                script.onload = () => resolve((globalThis as any).confetti as any);
+                  "https://cdn.jsdelivr.net/npm/canvas-confetti@1.5.1/dist/confetti.browser.min.js";
+                script.onload = () =>
+                  resolve((globalThis as any).confetti as any);
                 script.onerror = reject;
                 document.head.appendChild(script);
                 script.remove();
@@ -68,7 +69,11 @@ export default component$(() => {
         >
           Time to celebrate
         </button>
-        <a href="https://qwik.builder.io/docs" target="_blank" class="button button-dark">
+        <a
+          href="https://qwik.builder.io/docs"
+          target="_blank"
+          class="button button-dark"
+        >
           Explore the docs
         </a>
       </div>

package/starters/apps/basic/src/components/starter/icons/qwik.tsx

@@ -1,4 +1,10 @@
-export const QwikLogo = ({ width = 100, height = 35 }: { width?: number; height?: number }) => (
+export const QwikLogo = ({
+  width = 100,
+  height = 35,
+}: {
+  width?: number;
+  height?: number;
+}) => (
   <svg
     width={width}
     height={height}

package/starters/apps/basic/src/components/starter/infobox/infobox.tsx

@@ -1,5 +1,5 @@
-import { Slot, component$ } from '@builder.io/qwik';
-import styles from './infobox.module.css';
+import { Slot, component$ } from "@builder.io/qwik";
+import styles from "./infobox.module.css";
 
 export default component$(() => {
   return (

package/starters/apps/basic/src/components/starter/next-steps/next-steps.tsx

@@ -1,29 +1,31 @@
-import { component$, $, useOnWindow, useSignal } from '@builder.io/qwik';
-import styles from './next-steps.module.css';
+import { component$, $, useOnWindow, useSignal } from "@builder.io/qwik";
+import styles from "./next-steps.module.css";
 
 export const GETTING_STARTED_STEPS = [
   {
-    message: "Press and hold the <b>ALT</b> key to activate 'Click-to-Source' mode",
+    message:
+      "Press and hold the <b>ALT</b> key to activate 'Click-to-Source' mode",
   },
   {
-    message: 'Select the title of this page while keeping the <b>ALT</b> key pressed',
+    message:
+      "Select the title of this page while keeping the <b>ALT</b> key pressed",
     hint: 'Edit the title and save the changes. If your editor does not open, have a look at <a href="https://github.com/yyx990803/launch-editor#supported-editors" target="_blank">this page</a> to set the correct <code>LAUNCH_EDITOR</code> value.',
   },
   {
     message:
-      '<b>Update</b> now the <code>routeLoader$</code> defined in the <code>src/routes//layout.tsx</code> file',
-    hint: 'Instead of returning the current date, you could return any possible string.<br />The output is displayed in the footer.',
+      "<b>Update</b> now the <code>routeLoader$</code> defined in the <code>src/routes//layout.tsx</code> file",
+    hint: "Instead of returning the current date, you could return any possible string.<br />The output is displayed in the footer.",
   },
   {
-    message: 'Create a <b>new Route</b> called <code>/me</code>',
+    message: "Create a <b>new Route</b> called <code>/me</code>",
     hint: 'Create a new directory called <code>me</code> in <code>src/routes</code>. Within this directory create a <code>index.tsx</code> file or copy the <code>src/routes/index.tsx</code> file. Your new route is now accessible <a href="/me" target="_blank">here</a> ✨',
   },
   {
-    message: 'Time to have a look at <b>Forms</b>',
+    message: "Time to have a look at <b>Forms</b>",
     hint: 'Open <a href="/demo/todolist" target="_blank">the TODO list App</a> and add some items to the list. Try the same with disabled JavaScript 🐰',
   },
   {
-    message: '<b>Congratulations!</b> You are now familiar with the basics! 🎉',
+    message: "<b>Congratulations!</b> You are now familiar with the basics! 🎉",
     hint: "If you need further info on how to use qwik, have a look at <a href='https://qwik.builder.io' target='_blank'>qwik.builder.io</a> or join the <a href='https://qwik.builder.io/chat' target='_blank'>Discord channel</a>.",
   },
 ];
@@ -32,9 +34,9 @@ export default component$(() => {
   const gettingStartedStep = useSignal(0);
 
   useOnWindow(
-    'keydown',
+    "keydown",
     $((e) => {
-      if ((e as KeyboardEvent).key === 'Alt') {
+      if ((e as KeyboardEvent).key === "Alt") {
         gettingStartedStep.value = 1;
       }
     })
@@ -50,19 +52,27 @@ export default component$(() => {
       <div class={styles.gettingstarted}>
         <div
           class={styles.intro}
-          dangerouslySetInnerHTML={GETTING_STARTED_STEPS[gettingStartedStep.value].message}
+          dangerouslySetInnerHTML={
+            GETTING_STARTED_STEPS[gettingStartedStep.value].message
+          }
         />
         <span
           class={styles.hint}
-          dangerouslySetInnerHTML={GETTING_STARTED_STEPS[gettingStartedStep.value].hint}
+          dangerouslySetInnerHTML={
+            GETTING_STARTED_STEPS[gettingStartedStep.value].hint
+          }
         />
       </div>
       {gettingStartedStep.value + 1 < GETTING_STARTED_STEPS.length ? (
         <button class="button-dark" onClick$={() => gettingStartedStep.value++}>
-          Continue with Step {gettingStartedStep.value + 2} of {GETTING_STARTED_STEPS.length}
+          Continue with Step {gettingStartedStep.value + 2} of{" "}
+          {GETTING_STARTED_STEPS.length}
         </button>
       ) : (
-        <button class="button-dark" onClick$={() => (gettingStartedStep.value = 0)}>
+        <button
+          class="button-dark"
+          onClick$={() => (gettingStartedStep.value = 0)}
+        >
           Re-Start
         </button>
       )}

package/starters/apps/basic/src/global.css

@@ -22,9 +22,9 @@ html {
   -moz-tab-size: 4;
   -o-tab-size: 4;
   tab-size: 4;
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
-    'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
-    'Segoe UI Symbol', 'Noto Color Emoji';
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }
 
 body {

package/starters/apps/basic/src/root.tsx

@@ -1,8 +1,12 @@
-import { component$ } from '@builder.io/qwik';
-import { QwikCityProvider, RouterOutlet, ServiceWorkerRegister } from '@builder.io/qwik-city';
-import { RouterHead } from './components/router-head/router-head';
+import { component$ } from "@builder.io/qwik";
+import {
+  QwikCityProvider,
+  RouterOutlet,
+  ServiceWorkerRegister,
+} from "@builder.io/qwik-city";
+import { RouterHead } from "./components/router-head/router-head";
 
-import './global.css';
+import "./global.css";
 
 export default component$(() => {
   /**

package/starters/apps/basic/src/routes/demo/flower/flower.css

@@ -31,7 +31,9 @@ h1 {
   display: block;
   width: var(--size);
   height: var(--size);
-  transform: rotateZ(calc(var(--rotation) * var(--state) * (var(--center) - var(--index))));
+  transform: rotateZ(
+    calc(var(--rotation) * var(--state) * (var(--center) - var(--index)))
+  );
   transition-property: transform, border-color;
   transition-duration: 5s;
   transition-timing-function: ease-in-out;