https://github.com/efiand/gulp-template

Шаблон с SSR/SPA на Vue и Svelte
https://github.com/efiand/gulp-template

a11y bem boilerplate eslint gulp image-optimization mobile-first nodejs pixelperfect portfolio-project postcss posthtml retinal-images sprite stylelint vanilla-js w3c-validation webp webpack

Last synced: 3 months ago
JSON representation

Шаблон с SSR/SPA на Vue и Svelte

• Host: GitHub
• URL: https://github.com/efiand/gulp-template
• Owner: efiand
• Created: 2020-06-16T09:54:24.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2024-07-22T16:30:03.000Z (6 months ago)
• Last Synced: 2024-07-22T20:02:51.548Z (6 months ago)
• Topics: a11y, bem, boilerplate, eslint, gulp, image-optimization, mobile-first, nodejs, pixelperfect, portfolio-project, postcss, posthtml, retinal-images, sprite, stylelint, vanilla-js, w3c-validation, webp, webpack
• Language: JavaScript
• Homepage: https://efiand.github.io/gulp-template/
• Size: 7.02 MB
• Stars: 2
• Watchers: 3
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# gulp-template

Стартовый шаблон для сборки сайта, основанного на HTML-файлах.

## Команды терминала

- Установка зависимостей: `npm ci`

- Сборка проекта в каталог `build`: `npm run build`

- Запуск в режиме разработки: `npm run dev`

- Запуск линтеров и валидаторов: `npm test`

- Запуск автоформатирования: `npm run format`

## Создание изоморфных приложений

### С помощью vue

```js

// source/scripts/apps/page.js

import Page from '../blocks/page.vue';

import Vue from 'vue';

export default (data) =>

  new Vue({

    data,

    render: (cb) => cb(Page)

  });

// source/scripts/main.js

import createApp from './apps/page.js';

createApp({ appData: window.appData.page }).$mount('.page');

```

### С помощью Svelte

```js

// source/scripts/apps/page.js

import Page from '../blocks/page.svelte';

export default Page;

// source/scripts/main.js

import App from './apps/page.js';

new App({

  hydrate: true,

  props: { appData: window.appData.page },

  target: document.querySelector('.page')

});

```