• Код объясните,пожалуйста на JS(комментарии,если можно).Особенно интересует зачем здесь this?

    @amokrushin
    this в данном примере не нужен, можно заменить на что угодно null, 1, NaN, undefined...
    В остальном этот код рассматривает скорее костыли вокруг arguments нежели применение контекста вызова.
    Единственное что сейчас нужно знать про "arguments" - никогда его не использовать.
    В современном js этот код может выглядеть как-то так:
    function sum(...args) {
      return args.reduce((acc, val) => acc + val);
    }
    
    function mul(...args) {
      return args.reduce((acc, val) => acc * val);
    }
    
    function applyAll(func, ...values) {
      return func(...values);
    }
    
    alert( applyAll(sum, 1, 2, 3) ); // 6
    alert( applyAll(mul, 2, 3, 4) ); // 24
    alert( applyAll(Math.max, 2, -2, 3) ); // 3
    alert( applyAll(Math.min, 2, -2, 3) ); // -2
    Ответ написан
  • Не стандартный роутер на vue, как решить проблему плавного перехода?

    @amokrushin
    Есть костыльный способ заменить маршруты роутера:
    import Vue from 'vue'
    import Router from 'vue-router'
    
    Vue.use(Router)
    
    const createRouter = () => new Router({
      mode: 'history',
      routes: []
    })
    
    const router = createRouter()
    
    export function resetRouter () {
      const newRouter = createRouter()
      router.matcher = newRouter.matcher // the relevant part
    }
    
    export default router

    https://github.com/vuejs/vue-router/issues/1234#is...
    Ответ написан
    Комментировать
  • Как можно вставить html в виде строки в конкретное место функции с помощью Webpack?

    @amokrushin
    Например так (если добавить еще обработку ошибок, как минимум 404):
    const fs = require('fs');
    
    module.exports.index = function (req, res, next) {
        fs.createReadStream('./src/pages/index.html').on('error', next).pipe(res);
    });

    Но лучше использовать модуль express.static, еще лучше оставить статику веб-серверу nginx.

    Если же речь не об этом, а, например, о том как в скрипте используемом в процессе сборки с помощью webpack получить html в виде строки, то можно использовать webpack raw-loader
    import htmlString from 'raw-loader!./src/pages/index.html';
    Ответ написан
    Комментировать
  • Как f.toString здесь работает и расскажите, что происходит в этом коде?

    @amokrushin
    sum(0)(...)(n) всегда возвращает функцию f
    Метод alert принимает на вход строку, поэтому в момент вызова alert выполняется автоматическое преобразование функции f к строке. По умолчанию метод f.toString функции вернул бы текст ее исходного кода, но для функции f метод был преопределен и теперь он возвращает значение currentSum из замыкания.
    Казалось бы все хорошо, но это не так. В логических преобразованиях объект (в частном случае -
    это функция) всегда true. Поэтому, хоть
    console.log( Number(sum(5)(-5)) );
    и возвращает 0, результат
    console.log( Boolean(sum(5)(-5)) );
    будет true.
    Ответ написан
    Комментировать
  • Как пробить переменную из функции функции в компонент (Vue)?

    @amokrushin
    Вопрос не очень ясен, что значит "пробить"? В какой компонент?
    Если имеется ввиду установить значение data.city1 того же компонента из функции init которая расположена в хуке created этого компонента, то:
    ymaps.ready(init.bind(this));
    function init() {
        this.city1 = 'sdf';
    }

    либо
    ymaps.ready(() => {
        this.city1 = 'sdf';
    });

    вместо this.city1, можно использовать this.$data.city1
    Ответ написан
    Комментировать
  • Как раскодировать строку?

    @amokrushin
    decodeURIComponent(escape('Bj\u00c3\u00b6rn H\u00c3\u00bcttner'))

    Функция escape имеет статус deprecated
    stackoverflow.com/questions/13356493/decode-utf-8-...

    Или так
    /**
     * Decodes utf-8 encoded string back into multi-byte Unicode characters.
     *
     * Can be achieved JavaScript by decodeURIComponent(escape(str)),
     * but this approach may be useful in other languages.
     *
     * @param   {string} utf8String - UTF-8 string to be decoded back to Unicode.
     * @returns {string} Decoded Unicode string.
     */
    function utf8Decode(utf8String) {
        if (typeof utf8String != 'string') throw new TypeError('parameter ‘utf8String’ is not a string');
        // note: decode 3-byte chars first as decoded 2-byte strings could appear to be 3-byte char!
        const unicodeString = utf8String.replace(
            /[\u00e0-\u00ef][\u0080-\u00bf][\u0080-\u00bf]/g,  // 3-byte chars
            function(c) {  // (note parentheses for precedence)
                var cc = ((c.charCodeAt(0)&0x0f)<<12) | ((c.charCodeAt(1)&0x3f)<<6) | ( c.charCodeAt(2)&0x3f);
                return String.fromCharCode(cc); }
        ).replace(
            /[\u00c0-\u00df][\u0080-\u00bf]/g,                 // 2-byte chars
            function(c) {  // (note parentheses for precedence)
                var cc = (c.charCodeAt(0)&0x1f)<<6 | c.charCodeAt(1)&0x3f;
                return String.fromCharCode(cc); }
        );
        return unicodeString;
    }

    https://gist.github.com/chrisveness/bcb00eb717e638...
    Ответ написан
    1 комментарий
  • Можно ли запустить сайт написанный на NodeJS без NodeJS?

    @amokrushin
    Node.js не подгружает никакие файлы *.vue (получите syntax error при попытке подключить .vue файл), этим занимается либо webpack c плагином vue-loader, либо browserify с плагином vueify, которые в свою очередь являются инструментами сборки клиентского кода в пакет (bundle) - отдельный файл в котором собран код со всеми зависимостями.
    Этим инструментам для работы нужен Node.js, но то что у них получается на выходе, с node.js уже никак не связано - в этом коде не будет никаких require/export. Просто скопируйте эти файлы из директории build, подключите на страницу тегом script, link и хостите чем угодно, nginx, IIS. Разумеется речь идет только о клиентской части приложения.
    Vue.js на ноду завязана только в одном месте - Server-Side Rendering, но это относится уже к серверной части приложения.
    Ответ написан
    4 комментария
  • Как собирать проект спомощью Gulp/Webpack непосредственно на сервере?

    @amokrushin
    Этот плагин не может знать где был собран проект, на локальном компе или нет. Что касается вебпака, то он оставляет свой след, точнее загрузчик модулей в итоговом скрипте, поэтому и детектится.
    Добавите на любую страницу скрипт
    <script type="application/javascript">
        window.webpackJsonp = window.webpackJsonp || true;
    </script>

    и плагин Wappalyzer покажет иконку вебпака для этой страницы.
    Что касается сборки на сервере, то действительно - также как и на локальном компе.
    Ответ написан
    Комментировать
  • Как правильно наследоваться от объекта Error?

    @amokrushin
    В консоль вы выводите не err.toString(), a err.stack, значит вопрос в том откуда берется этот stack
    Смотрим
    1. throw new Error404("Ресурс не найден!");
    2. Error404 вызывается конструктор родителя - APIError super(message, 404, 2);
    3. APIError вызывается конструктор родителя - Error super(message);
    4. Конструктор Error. Здесь появляется this.stack - строка которая начинается с Error: Ресурс не найден!

    5. Возвращаемся к конструктору APIError после super(message); Меняется имя this.name = 'APIError'; После этого статический метод Error.captureStackTrace перезаписывает свойство this.stack на сей раз уже используя имя 'APIError', теперь this.stack начинается с APIError: Ресурс не найден!

    6. возвращаемся к конструктору Error404, меняем имя this.name = 'Error404';, но в строке this.stack так и остается APIError: Ресурс не найден!



    Исправить можно, например перенеся свойство name в прототип
    APIError.prototype.name = 'APIError';
    Error404.prototype.name = 'Error404';


    Либо удалить
    if (Error.captureStackTrace) {
        Error.captureStackTrace(this, this.constructor);
    } else {
        this.stack = (new Error()).stack;
    }

    Похоже на то, что для this.stackError устанавливает геттер затем используется ленивое вычисление, и если его не трогать раньше времени, то получится ожидаемое значение.
    Ответ написан
    Комментировать
  • Как в webpack импортировать jquery библиотеку?

    @amokrushin
    Оно и понятно, ведь эта библиотека не использует module.exports и следовательно, ничего не возвращает.

    Это не библиотека а плагин jQuery, который оформлен в виде модуля UMD, module.exports в коде есть, а ничего не возвращает, потому как в этом нет необходимости.

    Сначала установить:
    npm i slick-carousel --save-dev
    Затем можно использовать следующим образом:
    require('slick-carousel');
    require('slick-carousel/slick/slick.css');
    require('slick-carousel/slick/slick-theme.css');
    const $ = require('jquery');
    $(document).ready(function(){
      $('.your-class').slick({
        setting-name: setting-value
      });
    });
    Ответ написан
  • Webpack. Как исправить ошибку Uncaught ReferenceError: webpackJsonp_name_ is not defined?

    @amokrushin
    Проблема в том, что к каждому модулю entry webpack добавляет свой загрузчик (webpack runtime). Плагин CommonsChunkPlugin унес этот загрузчик в файл commons.js, который загружается в браузере вторым по очереди. А на момент исполнения кода файла babelPolyfill.js код загрузчика отсутствует и возникает ошибка.
    Как исправить?
    Есть такие варианты:
    1. удалить плагин CommonsChunkPlugin
    2. удалить babelPolyfill.js из конфига webpack и подключать уже готовую версию перед остальными тегами script
    3. подключать рекомендованным способом в том скрипте который загружается первым
    4. можно вынести webpack runtime в отдельный файл добавив еще раз плагин CommonsChunkPlugin после того что уже есть
    new webpack.optimize.CommonsChunkPlugin({
        name: 'webpack.runtime',
        minChunks: Infinity,
    })

    и загружать его первым
    <script src="./public/webpack.runtime.js"></script>
    но это точно костыль
    Ответ написан
    Комментировать
  • Как импортировать стили из node_modules в компонент vue.js?

    @amokrushin
    <script>
    import fullcalendar from 'fullcalendar'
    import 'fullcalendar/dist/fullcalendar.min.css'
    Ответ написан