Skip to content

D
default2
Commit 8f88440b authored by Yuri Bondarenko's avatar Yuri Bondarenko
Browse files
Options

js

parent f34a8eb1
Hide whitespace changes
Inline Side-by-side
Showing with 44 additions and 27 deletions
gulpfile.js
View file @ 8f88440b
/* ======================================================== */
/* global require */
var gulp = require( 'gulp' ); // Собственно gulp
var pump = require( 'pump' ); // отслеживание ошибок
const gulp = require( 'gulp' ); // Собственно gulp
const pump = require( 'pump' ); // отслеживание ошибок
var concat = require( 'gulp-concat' ); // объединение набора файлов в один
var include = require( 'gulp-file-include' ); // включение файлов
var clean = require( 'gulp-clean' ); // удаление файлов и каталогов
const concat = require( 'gulp-concat' ); // объединение набора файлов в один
const include = require( 'gulp-file-include' ); // включение файлов
const clean = require( 'gulp-clean' ); // удаление файлов и каталогов
var postcss = require( 'gulp-postcss' ); // Пост-обработка CSS
var postcssPresetEnv = require( 'postcss-preset-env' ); // CSS Next
var cssvariables = require('postcss-css-variables'); // полифил для CSS-переменных
var atImport = require('postcss-import'); // парсинг и включение импорта CSS
var sourcemaps = require( 'gulp-sourcemaps' ); // карты исходного кода
const postcss = require( 'gulp-postcss' ); // Пост-обработка CSS
const postcssPresetEnv = require( 'postcss-preset-env' ); // CSS Next
const cssvariables = require('postcss-css-variables'); // полифил для CSS-переменных
const atImport = require('postcss-import'); // парсинг и включение импорта CSS
const sourcemaps = require( 'gulp-sourcemaps' ); // карты исходного кода
var webpack = require( 'webpack-stream' );
var compiler = require( 'webpack' );
const webpack = require( 'webpack-stream' );
const compiler = require( 'webpack' );
var imagemin = require( 'gulp-image' ); // оптимизация картинок
var cache = require( 'gulp-cache' );
const imagemin = require( 'gulp-image' ); // оптимизация картинок
const cache = require( 'gulp-cache' );
var browserSync = require( 'browser-sync' ).create(); // обновление налету
const browserSync = require( 'browser-sync' ).create(); // обновление налету
/* ========================================================== */
......@@ -212,7 +212,7 @@ gulp.task( 'dev:html', function( cb ){
'./src/robots.txt'
] ),
gulp.dest( './dev' )
], cb );
]);
});
......@@ -258,8 +258,8 @@ gulp.task( 'DEV', [ 'dev:img', 'dev:css', 'dev:js', 'dev:html' ], function() {
gulp.watch( './src/assets/css/*.css' , ['dev:css']);
gulp.watch( './src/components/**/*.css' , ['dev:css']);
gulp.watch( './src/assets/js/*.js', [ 'dev:js' ] );
gulp.watch( './src/components/**/*.js', [ 'dev:js' ] );
gulp.watch( './src/assets/js/*.js', [ 'dev:js' ] ).on('change', browserSync.reload);
gulp.watch( './src/components/**/*.js', [ 'dev:js' ] ).on('change', browserSync.reload);
gulp.watch( './dev/assets/js/**/*' ).on('change', browserSync.reload);
gulp.watch( './src/**/*.html', [ 'dev:html' ] );
......
src/assets/js/app.js
View file @ 8f88440b
alert(
() => {
console.log(1);
}
);
\ No newline at end of file
import Button from '../../components/header';
const button = new Button();
button.buttonAlert();
// Comment
\ No newline at end of file
src/components/button/button.css
View file @ 8f88440b
:root {
--buttonText: #333;
--buttonBg: #999;
--buttonText: #fff;
--buttonBg: #f00;
}
.button {
......
src/components/header/index.js 0 → 100644
View file @ 8f88440b
export default class Header {
buttonAlert() {
const button = document.querySelector( '.button' );
button.addEventListener( 'click', () => {
alert( `Message from button: ${button.innerHTML}` );
});
}
}
\ No newline at end of file
src/index.html
View file @ 8f88440b
......@@ -8,14 +8,15 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="/assets/css/index.css?@@rev" />
<link rel="stylesheet" href="/assets/css/app.css?@@rev" />
</head>
<body>
@@include( './components/header/index.html' )
<script src="https://cdn.polyfill.io/v2/polyfill.js?features=es6,fetch"></script>
<script src="/assets/js/app.js?@@rev" type="module"></script>
</body>
......
webpack.dev.js
View file @ 8f88440b
......@@ -5,6 +5,12 @@
/* global module */
module.exports = {
mode: 'development',
entry: {
app: './src/assets/js/app.js'
},
output: {
filename: '[name].js'
},
devtool: 'source-map',
module: {
rules: [
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment