Electron + SQLite + Tailwind構成を試してみる

$ npm create electron-webpack
Need to install the following packages:
  create-electron-webpack@0.0.6
Ok to proceed? (y) y
? Project name: electron-sqlite
? Select a framework: react
? Select a variant: TypeScript
? Select a package manager: npm

added 5 packages, and audited 6 packages in 2s

found 0 vulnerabilities
npm WARN deprecated asar@3.2.0: Please use @electron/asar moving forward.  There is no API change, just a package name change
npm WARN deprecated electron-osx-sign@0.6.0: Please use @electron/osx-sign moving forward. Be aware the API is slightly different

added 522 packages, and audited 528 packages in 59s

104 packages are looking for funding
  run `npm fund` for details

6 high severity vulnerabilities

To address all issues, run:
  npm audit fix

Run `npm audit` for details.

Scaffolding project in /Users/shuntaka/repos/github.com/shuntaka9576/electron-sqlite/electron-sqlite

Done. Now run:

  cd electron-sqlite
  npm run dev

npm install --save-dev typescript ts-node @types/node

npm install -D tailwindcss
npx tailwindcss init

npx create-next-app --example with-electron-typescript

$ npx create-next-app --example with-electron-typescript
✔ What is your project named? … electron-sqlite
Creating a new Next.js app in /Users/shuntaka/repos/github.com/shuntaka9576/electron-sqlite.

Downloading files for example with-electron-typescript. This might take a moment.

Installing packages. This might take a couple of minutes.

npm WARN deprecated asar@3.2.0: Please use @electron/asar moving forward.  There is no API change, just a package name change
npm WARN deprecated electron-osx-sign@0.6.0: Please use @electron/osx-sign moving forward. Be aware the API is slightly different

added 292 packages, and audited 293 packages in 46s

27 packages are looking for funding
  run `npm fund` for details

9 vulnerabilities (3 moderate, 6 high)

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.

Initialized a git repository.

Success! Created electron-sqlite at /Users/shuntaka/repos/github.com/shuntaka9576/electron-sqlite
Inside that directory, you can run several commands:

  npm run dev
    Starts the development server.

  npm run build
    Builds the app for production.

  npm start
    Runs the built app in production mode.

We suggest that you begin by typing:

  cd electron-sqlite
  npm run dev

npm install tailwindcss@latest postcss@latest autoprefixer@latest
npx tailwindcss init -p

module.exports = {
  content: ["./renderer/pages/**/*.{js,ts,jsx,tsx}",
    "./renderer/components/**/*.{js,ts,jsx,tsx}"],
  theme: {
    extend: {},
  },
  plugins: [],
}

import "tailwindcss/tailwind.css";

function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />;
}

export default MyApp;