• Алгоритмы и структуры данных для веб разработчика?

    @beefront17 Автор вопроса
    sim3x, тогда посоветуйте что-нибудь
  • Как протестировать setTimeOut, jest/enzyme?

    @beefront17 Автор вопроса
    Александр, имелось в виду выполнение функции в setTimeOut (через 1 сек)
  • Вывести элемент по клику, react?

    @beefront17 Автор вопроса
    Точно, спасибо)
  • Как улучшить функцию, js?

    @beefront17 Автор вопроса
    Спасибо)
  • Как изменять все свойства объектов, js?

    @beefront17 Автор вопроса
    McBernar, это не будет работать!
    надо еще одному поставить true
  • Как изменять все свойства объектов, js?

    @beefront17 Автор вопроса
    в таком случае будет два true и один false
  • Ссылка вернуться назад в react-native-navigation?

    @beefront17 Автор вопроса
    Роман Александрович, да, большой.
    переход не вариант
  • Как уменьшить бандл вебпак 4?

    @beefront17 Автор вопроса
    Антон Спирин, Хочу убрать WARNINGs.
    Скорей всего там много лишнего, без чего можно обойтись.

    нет, просто проект большой
  • Как уменьшить бандл вебпак 4?

    @beefront17 Автор вопроса
    Антон Спирин, почему бандл увеличился
  • Как уменьшить бандл вебпак 4?

    @beefront17 Автор вопроса
    Антон Спирин, с этим разобрался.
    на данный момент бандл стал меньше на 30 кб, но WARNINGs остаются,
    не совсем понимаю как их исправить и нужно ли если проект очень большой?!
  • Как уменьшить бандл вебпак 4?

    @beefront17 Автор вопроса
    почему DefinePlugin не используете?

    не совсем понимаю чем он мне поможет

    Вы в прод режиме сборку делаете?

    да
  • Как уменьшить бандл вебпак 4?

    @beefront17 Автор вопроса
    Антон Спирин, Проект на react/redux.
    Уверены, что на чанки нельзя разбить?

    Можно пример минимальный?
    require.ensure?

    можно поподробнее?

    Не понимаю почему бандл увеличился...
  • Проблема с css-модулями webpack 4?

    @beefront17 Автор вопроса
    Mikhail Osher, и почему создаеться папка vendors~main-345434.js?
  • Как мигрировать на webpack 4?

    @beefront17 Автор вопроса
    с этим разобрался
    по этой ошибке можете что-то сказать?
    ERROR in ./app/style.scss
    Module build failed: ReferenceError: window is not defined
  • Проблема с css-модулями webpack 4?

    @beefront17 Автор вопроса
    Mikhail Osher,
    const cssnanoConf = cssnano({
      autoprefixer: {
        add: true,
        remove: true,
      },
      discardComments: {
        removeAll: true,
      },
      discardDuplicates: true,
      discardUnused: false,
      mergeIdents: false,
      sourcemap: true,
    });
    
    module.exports = merge(require('./webpack.base.config'), {
      mode: 'production',
      devtool: 'source-map',
      module: {
        rules: [{
          test: /\.(s?css|sass)$/,
          exclude: /app[\\/](components|scenes)[\\/].+\.scss$/,
          use: [
            MiniCssExtractPlugin.loader,
            'style-loader',
            'css-loader',
            {
              loader: 'postcss-loader',
              options: {
                plugins() {
                  return [cssnanoConf];
                },
              },
            },
            {
              loader: 'sass-loader',
              options: {
                includePaths: ['./node_modules'],
              },
            },
          ],
        }, {
          test: /app[\\/](components|scenes)[\\/].+\.scss$/,
          use: [
            MiniCssExtractPlugin.loader,
            {
              loader: 'style-loader',
            },
            {
              loader: 'css-loader',
              options: {
                modules: true,
                localIdentName: '[local]___[hash:base64:5]',
              },
            },
            {
              loader: 'postcss-loader',
              options: {
                plugins() {
                  return [cssnanoConf];
                },
              },
            },
            {
              loader: 'sass-loader',
              options: {
                includePaths: ['./node_modules'],
              },
            },
          ],
        }],
      },
      optimization: {
        minimizer: [
          new UglifyJSPlugin({
            uglifyOptions: {
              output: {
                comments: false,
              },
              compress: {
                unsafe_comps: true,
                properties: true,
                keep_fargs: false,
                pure_getters: true,
                unused: true,
                hoist_funs: true,
                if_return: true,
                join_vars: true,
                cascade: true,
                drop_console: true,
              },
            },
          }),
        ],
      },
      plugins: [
        new MiniCssExtractPlugin({
          filename: 'main-[hash:6].css',
          allChunks: true,
        }),
        new UglifyJSPlugin({}),
        new webpack.optimize.ModuleConcatenationPlugin(),
        new webpack.LoaderOptionsPlugin({
          minimize: true,
        }),
      ],
    });


    Сейчас уже ошибки

    /style.scss
    ERROR in ../style.scss
    Module build failed: ReferenceError: window is not defined
    ...
  • Проблема с css-модулями webpack 4?

    @beefront17 Автор вопроса
    Спасибо, в дев режиме заработало, но там я не использовал "extract-text-webpack-plugin".
    В production режиме сейчас error
    Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
     - configuration.module.rules[6].use should be one of these:
       non-empty string | function | object { loader?, options?, ident?, query? } | function | [non-empty string | function | object { loader?, options?, ident?, query? }]
       -> Modifiers applied to the module when rule is matched
       Details:
        * configuration.module.rules[5].use should be a string.
        * configuration.module.rules[5].use should be an instance of function
        * configuration.module.rules[5].use should be an object.
        * configuration.module.rules[5].use should be an instance of function
        * configuration.module.rules[5].use[1] should be a string.
        * configuration.module.rules[5].use[1] should be an instance of function
        * configuration.module.rules[5].use[1] has an unknown property 'fallback'. These properties are valid:
          object { loader?, options?, ident?, query? }
        * configuration.module.rules[6].use should be a string.
        * configuration.module.rules[6].use should be an instance of function
        * configuration.module.rules[6].use should be an object.
        * configuration.module.rules[6].use should be an instance of function
        * configuration.module.rules[6].use[1] should be a string.
        * configuration.module.rules[6].use[1] should be an instance of function
        * configuration.module.rules[6].use[1] has an unknown property 'fallback'. These properties are valid:
          object { loader?, options?, ident?, query? }
  • Как мигрировать на webpack 4?

    @beefront17 Автор вопроса
    Александр, после обновления всех лоадеров в dev режиме заработало.
    но в production error
    Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
     - configuration.module.rules[6].use should be one of these:
       non-empty string | function | object { loader?, options?, ident?, query? } | function | [non-empty string | function | object { loader?, options?, ident?, query? }]
       -> Modifiers applied to the module when rule is matched
       Details:
        * configuration.module.rules[5].use should be a string.
        * configuration.module.rules[5].use should be an instance of function
        * configuration.module.rules[5].use should be an object.
        * configuration.module.rules[5].use should be an instance of function
        * configuration.module.rules[5].use[1] should be a string.
        * configuration.module.rules[5].use[1] should be an instance of function
        * configuration.module.rules[5].use[1] has an unknown property 'fallback'. These properties are valid:
          object { loader?, options?, ident?, query? }
        * configuration.module.rules[6].use should be a string.
        * configuration.module.rules[6].use should be an instance of function
        * configuration.module.rules[6].use should be an object.
        * configuration.module.rules[6].use should be an instance of function
        * configuration.module.rules[6].use[1] should be a string.
        * configuration.module.rules[6].use[1] should be an instance of function
        * configuration.module.rules[6].use[1] has an unknown property 'fallback'. These properties are valid:
          object { loader?, options?, ident?, query? }
  • Проблема с css-модулями webpack 4?

    @beefront17 Автор вопроса
    Mikhail Osher,
    "devDependencies": {
        "babel-core": "^6.26.0",
        "babel-eslint": "^8.0.3",
        "babel-jest": "^22.1.0",
        "babel-loader": "^7.1.2",
        "babel-plugin-react-css-modules": "^3.3.2",
        "babel-plugin-react-remove-properties": "^0.2.5",
        "babel-plugin-syntax-dynamic-import": "^6.18.0",
        "babel-plugin-transform-class-properties": "^6.24.1",
        "babel-plugin-transform-decorators-legacy": "^1.3.4",
        "babel-plugin-transform-object-rest-spread": "^6.26.0",
        "babel-plugin-transform-react-remove-prop-types": "^0.4.10",
        "babel-plugin-transform-runtime": "^6.23.0",
        "babel-preset-env": "^1.6.0",
        "babel-preset-es2015": "^6.24.1",
        "babel-preset-react": "^6.24.1",
        "babel-preset-stage-1": "^6.24.1",
        "babel-preset-stage-2": "^6.24.1",
        "babel-register": "^6.26.0",
        "copy-webpack-plugin": "^4.5.1",
        "cross-env": "^5.1.1",
        "css-hot-loader": "^1.3.9",
        "css-loader": "^0.28.11",
        "cssnano": "^3.10.0",
        "eslint": "^4.6.1",
        "eslint-config-airbnb": "^16.1.0",
        "eslint-import-resolver-webpack": "^0.9.0",
        "eslint-plugin-import": "^2.8.0",
        "eslint-plugin-jsx-a11y": "^6.0.2",
        "eslint-plugin-react": "^7.5.1",
        "extract-text-webpack-plugin": "^3.0.2",
        "file-loader": "^0.11.2",
        "html-webpack-plugin": "^3.2.0",
        "husky": "^0.14.3",
        "lint-staged": "^6.0.0",
        "node-sass": "^4.5.3",
        "postcss-loader": "^2.1.3",
        "postcss-nested": "^3.0.0",
        "postcss-scss": "^1.0.5",
        "raw-loader": "^0.5.1",
        "sass-loader": "^6.0.6",
        "style-loader": "^0.19.0",
        "stylelint": "^8.4.0",
        "stylelint-config-standard": "^18.0.0",
        "stylelint-order": "^0.8.0",
        "stylelint-scss": "^2.2.0",
        "uglifyjs-webpack-plugin": "^1.2.4",
        "url-loader": "^0.5.9",
        "webpack": "^4.5.0",
        "webpack-bundle-analyzer": "^2.11.1",
        "webpack-cli": "^2.0.14",
        "webpack-dev-server": "^3.1.1",
        "webpack-merge": "^4.1.2"
      },
  • Проблема с css-модулями webpack 4?

    @beefront17 Автор вопроса
    Froggyweb, Пока проблема только с development режимом,
    а там я не использую ExtractTextPlugin.
    Сейчас у меня все стили записываются так
    <div styleName="some-class"> .... </div>
    и этот div появляется без класса 'some-class__'
    хотя сам стиль в css есть
    Вот в чем проблема...