0.0.0 • Published 8 months ago

froggo v0.0.0

Weekly downloads
-
License
ISC
Repository
-
Last release
8 months ago

Froggo

Project scaffolder for Screaming Frog projects.

NOTE: This project uses Yarn. You can get Yarn here.

Installation

# yarn
yarn global add froggo

# npm
sudo npm i -g froggo

Updating

# yarn
yarn global add froggo

# npm
sudo npm update -g froggo

Usage

froggo create <projectName>

Guides

NOTE: These guides are for use in generated projects, not the build-tool itself.

Supporting legacy browsers

  1. Install dependencies:
# yarn
yarn add -D @vitejs/plugin-legacy

# npm
npm i -D @vitejs/plugin-legacy
  1. Modify vite.config.js
...
import legacy from '@vitejs/plugin-legacy'
...

export default defineConfig({
  ...
  plugins: [legacy({ targets: ['defaults'] })]
  ...
})

Disabling file-hashing

  1. Locate the vite.config.js file

  2. Remove the .[hash] string from output file names:

export default defineConfig({
  ...
  build: {
    rollupOptions: {
      output: {
        // before
        assetFileNames: 'assets/[name].[hash].[ext]'

        // after
        assetFileNames: 'assets/[name].[ext]'
      }
    }
  }
  ...
})

Disabling minification

  1. Locate the vite.config.js file

  2. Replace the minifier's name with false:

export default defineConfig({
  ...
  build: {
    // before
    minify: 'terser'

    // after
    minify: false
  }
  ...
})

Using Tailwind.css

  1. Locate the tailwind.config.js file

  2. Enable removal of unused CSS by providing paths to the project's.html (and optionally .js/.ts/.vue) files:

module.exports = {
  ...
  purge: ['./src/**/*.{html,js,ts,vue}']
  ...
}
  1. (Optional): Enable jit mode for faster reload/build times:
module.exports = {
  ...
  mode: 'jit'
  ...
}

Adding Vue.js

  1. Install dependencies:
# yarn
yarn add vue@next; yarn add -D @vitejs/plugin-vue @vue/compiler-sfc

# npm
npm i vue@next; npm i -D @vitejs/plugin-vue @vue/compiler-sfc
  1. Modify vite.config.js
...
import vue from '@vitejs/plugin-vue'
...

export default defineConfig({
  ...
  plugins: [vue()]
  ...
})
  1. Modify index.html
<body>
  ...
  <!-- Vue application will be injected here -->
  <div id="app"></div>
  ...
</body>
  1. Modify main.ts
...
import { createApp } from 'vue'
import App from './App.vue'
...

createApp(App).mount('#app')
  1. Create shims-vue.d.ts in the src/ directory, and add the following:
declare module '*.vue' {
  import { ComponentOptions } from 'vue'
  const component: ComponentOptions
  export default component
}
1.1.1

3 years ago

1.1.0

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago

1.1.3

3 years ago

1.1.2

3 years ago

0.0.0

8 months ago

2.0.0-alpha.0

3 years ago

1.0.0-alpha.3

3 years ago

1.0.0-alpha.2

3 years ago

1.0.0-alpha.1

3 years ago

1.0.0-alpha.0

3 years ago

0.1.2

3 years ago

0.1.1

3 years ago

0.1.0

3 years ago

0.0.0-0

3 years ago