maksimrakomin

gulp.task('mytask', function(){
  gulp.src('app/*.*')
      .pipe(gulp.dest('dist/'));
});

gulp.task('html', ['mytask'], function(){
  gulp.src(path.app.html)
                 ... 
    .pipe(gulp.dest(path.dist.html));
});

obj = { a: 1, b: 2, c: 3}

keys = Object.keys(obj)

for (var i = 0, l = keys.length; i < l; i++) {
  console.log(keys[i] + ' is ' + obj[keys[i]]);
  // keys[i] - это ключ
  // obj[keys[i]] - а это свойство, доступное по этому ключу
}

Можно по-разному, всё зависит от задачи.

Если еще актуально, я нашел решение данной проблемы тут : https://github.com/webpack/webpack-dev-server/issu....

Кратко, проблема заключается в .browserslist .
Нужно в webpack.config.js добавить данную проверку:

target: process.env.NODE_ENV === "development" ? "web" : "browserslist",

Как-то так)

А также в Webpack 5 изменился вызов dev сервера.

"start": "cross-env NODE_ENV=development webpack serve"

Чаще всего, как уже написали, встречается в URL, но все же его значение чуть более шире - slug это уникальная строка идентификатор, понятная человеку (в отличие от ID) и содержащая только "безопасные" символы:
- 0-9
- a-z (общепринято - в нижнем регистре)
- символ -
- иногда еще символ _
Могут использоваться не только в URL для понятности, но и, например, в запросах к БД (в первую очередь - на уровне АПИ) - ведь
SELECT * FROM pages WHERE category="some-slug"
более понятно, чем
SELECT * FROM pages WHERE category=126.
На уровне API это выглядит как
get_pages_in_category( 'some-slug' )
или
$object->get_pages_in_category( 'some-slug' ).
В общем, это человеко-понятный уникальный идентификатор.

const a = [ 'a', 'b', 'c', 'd' ];
const b = [ 'a', 'b', 'x', 'y', 'z' ];

const c = a.filter(n => b.indexOf(n) === -1);
// или
const c = a.filter(n => !b.includes(n));

Или, можно решить задачу в более общем виде. Пусть в качестве источников данных выступают не только массивы, а любые массивоподобные объекты; их элементы не обязательно являются примитивными значениями; а под равенством может подразумеваться не непосредственное равенство, а равенство некоторых производных значений:

function diff(data1, data2, key = n => n) {
  const getKey = key instanceof Function ? key : n => n[key];
  const keys = new Set(Array.from(data2, getKey));
  return Array.prototype.filter.call(data1, n => !keys.has(getKey(n)));
}


diff([1, 2, 3], [2]) // [1, 3]
diff([{id: 1}, {id: 2}, {id: 3}], [{id: 1}, {id: 3}], 'id') // [{id: 2}]
diff('AbCdE', 'aBc', n => n.toLowerCase()) // ['d', 'E']

const locations = [
  { latlng: [55.692222,37.532778] },
  { latlng: [55.743889,37.4975] },
  { latlng: [55.793611,37.5875] },
  { latlng: [55.73852,37.61734] },
  { latlng: [55.7408,37.7469] },
];

const iconDefault = 'https://icons.iconarchive.com/icons/icons-land/vista-map-markers/32/Map-Marker-Marker-Outside-Pink-icon.png';
const iconActive = 'https://icons.iconarchive.com/icons/icons-land/vista-map-markers/32/Map-Marker-Marker-Outside-Chartreuse-icon.png';

function onClick() {
  locations.forEach(n => n.marker.setIcon(n.marker !== this ? iconDefault : iconActive));
}

google.maps.event.addDomListener(window, 'load', function() {
  const map = new google.maps.Map(document.querySelector('#map'), {
    zoom: 11,
    center: new google.maps.LatLng(55.74, 37.58),
  });

  locations.forEach(n => {
    n.marker = new google.maps.Marker({
      position: new google.maps.LatLng(...n.latlng),
      map: map,
      icon: iconDefault
    });
    n.marker.addListener('click', onClick);
  });
});

Сложно это всё. Четыре селекта - очень похожие, четыре вычисляемых свойства - очень похожие. Многовато копипасты. Надо упростить.

Первым делом внимательно посмотрим на все эти похожие куски кода, найдём, где они отличаются, и на основе этих отличий сделаем описание фильтров:

filters: [
  { name: 'calculator.brand_filter', getter: obj => obj.brand.name, value: '' },
  { name: 'calculator.company_filter', getter: obj => obj.company.name, value: '' },
  { name: 'calculator.country_filter', getter: obj => obj.brand.country, value: '' },
  { name: 'calculator.side_filter', getter: obj => obj.sides, value: '' },
],

Затем сделаем собственно фильтрацию, пропустим данные через массив фильтров (если значение фильтра выставлено - производится фильтрация, нет - оставляем данные как есть):

computed: {
  filteredProfiles() {
    return this.filters.reduce((profiles, { value, getter }) => {
      return value
        ? profiles.filter(n => getter(n) === value)
        : profiles;
    }, this.profiles);
  },

Далее, надо дать пользователю возможность задавать значения фильтров. Сделаем компонент фильтра:

Vue.component('filter-select', {
  props: [ 'name', 'options', 'value' ],
  template: `
<div>
  <p>{{ name }}<p>
  <select :value="value" @change="$emit('input', $event.target.value)">
    <option value="">-</option>
    <option v-for="n in options">{{ n }}</option>
  </select>
</div>`
});

Подготовим опции для фильтров - массивы уникальных значений, по которым будет осуществляться фильтрация:

computed: {
  filterOptions() {
    return this.filters.map(n => [...new Set(this.profiles.map(n.getter))]);
  },

Наконец, создадим сами фильтры:

<filter-select
  v-for="(n, i) in filters"
  v-model="n.value"
  :options="filterOptions[i]"
  :name="trans(n.name)"
></filter-select>

Также не будем забывать про обнуление значений фильтров. Так что вот метод сброса фильтров и кнопка, по клику на которую он будет вызываться:

methods: {
  resetFilters() {
    this.filters.forEach(n => n.value = '');
  },

<button @click="resetFilters">{{ trans('calculator.reset_filter') }}</button>

Демо можно посмотреть здесь (да, тут меньше фильтров, чем у вас - ну так вы свои данные не показали, а у меня воображения на большее не хватило).

https://jsfiddle.net/pwtmb809/
границы так, для видимости

Для vscode есть vscode-htmltagwrap

ну так верно, вы вешаете событие на тот момент, когда у вас есть только шаблон, и клик срабатывает только на него, в данном случае нужно делегировать событие

$(".channels").on("click", ".linkurl", function(){ /*    */ })

либо добавлять слушатель события только после добавления элемента (когда он уже существует в DOM)

$("div.channels ul")
  .append($('<li>')
  .append($(item)))
  .show();
$(item).click(function(){ /*    */ })

Возможно, кому-то полезно будет.
Решение

Вам надо переинициализировать слайдер после переключения таба