Skip to content

Webpack#2

Open
evgdudareff wants to merge 6 commits intodev-jsfrom
webpack
Open

Webpack#2
evgdudareff wants to merge 6 commits intodev-jsfrom
webpack

Conversation

@evgdudareff
Copy link
Owner

  • режимы dev, build
  • минификация файлов
  • babel

evgdudareff and others added 5 commits January 28, 2020 21:35
-relocate all files into src folder
-add dev and build srcipts
-add minification for files
-ie 11 doesn`t work :(
Copy link

@gooverdian gooverdian left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Можно чуть улучшить, в целом - очень хорошо - пока оценка 7 / 10

package.json Outdated
"postcss-loader": "^3.0.0",
"style-loader": "^1.1.3",
"terser-webpack-plugin": "^2.3.3",
"url-loader": "^3.0.0"

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

почти все из этого должно быть в dev, незачем захламлять production сборку
если нет понимания что куда:
production - то, без чего не заработает уже собранное
development - все остальное - то, без чего не соберется, или то, что нужно для разработки (дев тулзы)

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

У меня получилось, что всё нужно только при сборке. Перенес

];
}
return config;
};

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Эту функцию можно переписать проще, возвратив пустой объект в начале

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Упростил

module.exports = {
devtool: "source-map", //связывает минимизированный и собранный код с исходным
context: path.resolve(__dirname, "src"), //относительный путь
mode: "development", //режим работы webpack по умолчанию

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Если что-то сломается - ты выкатишь development версию на прод. По умолчанию всегда должно быть production

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Исправил

};

module.exports = {
devtool: "source-map", //связывает минимизированный и собранный код с исходным

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Сам факт использования сурс-мапов - отличная идея, но нужны ли сурс-мапы для development?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Прошу прощения, имел в виду production, конечно

Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Теперь сурсы только в development

}
}),
//очищает папку dist
new CleanWebpackPlugin(),

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

}
]),
//минимизация картинок
new ImageminWebpackPlugin({

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

- relocated packages to devDependencies;
- simplified optimize function;
- set production mode by default;
- source-map active only for development mode
Copy link

@gooverdian gooverdian left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Да, так лучше
9 / 10
(это максимальный балл без галпа, на нем я не настаиваю, но если кто-то сделает, у меня должна быть возможность это оценить)


//Функция оптимизации
const optimize = () => {
if (!isProduction) return {};

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Сейчас у вас нет codestyle-guide, и ты можешь писать, как хочешь. Но на заметку - почти во всех стайлгайдах запрещена такая запись, всегда нужно использовать фигурные скобки, это повышает читаемость кода, я имел в виду примерно такой вид функции:

const optimize = () => {
    if (isDevelopment) {
        return {};
    }

    return {
        minimizer: [new OptimizeCssAssetsPlugin(), new TerserWebpackPlugin()],
    };
};

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants