Size: a a a

JS Liberty [ОЫ]

2020 June 20

В

Виктория in JS Liberty [ОЫ]
Vova
крч, я так понял что целый день буду читать о оптимизации веб пака
Так поди место в конфиге покажешь, где эти иконки настраиваются?
источник

V

Vova in JS Liberty [ОЫ]
Th0r
это сбилженный? или дев?
я тупанул, я уже понял косяк) в девеолпент 21 мб был, в билде 1 мб
источник

А

Аркаша Одесский 🇪🇪... in JS Liberty [ОЫ]
Ты же не все используешь иконки
источник

V

Vova in JS Liberty [ОЫ]
Виктория
Так поди место в конфиге покажешь, где эти иконки настраиваются?
{
       test: /\.svg$/,
       loader: 'svg-inline-loader'
     }
я просто это прописал и все
источник

T

Th0r in JS Liberty [ОЫ]
Vova
я тупанул, я уже понял косяк) в девеолпент 21 мб был, в билде 1 мб
а проект крупный? тришейкинг настроен?
источник

А

Аркаша Одесский 🇪🇪... in JS Liberty [ОЫ]
В кра такого не было по моему...
источник

V

Vova in JS Liberty [ОЫ]
Th0r
а проект крупный? тришейкинг настроен?
нее
источник

V

Vova in JS Liberty [ОЫ]
Th0r
а проект крупный? тришейкинг настроен?
{
 "name": "login",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
   "build": "webpack",
   "dev": "webpack-dev-server --mode development --color"
 },
 "author": "",
 "license": "ISC",
 "devDependencies": {
   "@babel/core": "^7.10.2",
   "@babel/preset-env": "^7.10.2",
   "@babel/preset-react": "^7.10.1",
   "babel-loader": "^8.1.0",
   "css-loader": "^3.6.0",
   "file-loader": "^6.0.0",
   "html-loader": "^1.1.0",
   "html-webpack-plugin": "^4.3.0",
   "sass": "^1.26.8",
   "sass-loader": "^8.0.2",
   "style-loader": "^1.2.1",
   "svg-inline-loader": "^0.8.2",
   "webpack": "^4.43.0",
   "webpack-cli": "^3.3.12",
   "webpack-dev-server": "^3.11.0"
 },
 "dependencies": {
   "@material-ui/core": "^4.10.2",
   "@material-ui/icons": "^4.9.1",
   "react": "^16.13.1",
   "react-dom": "^16.13.1",
   "react-router-dom": "^5.2.0"
 }
}
источник

S

Syntax Highlight Bot in JS Liberty [ОЫ]
Vova
{
 "name": "login",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
   "build": "webpack",
   "dev": "webpack-dev-server --mode development --color"
 },
 "author": "",
 "license": "ISC",
 "devDependencies": {
   "@babel/core": "^7.10.2",
   "@babel/preset-env": "^7.10.2",
   "@babel/preset-react": "^7.10.1",
   "babel-loader": "^8.1.0",
   "css-loader": "^3.6.0",
   "file-loader": "^6.0.0",
   "html-loader": "^1.1.0",
   "html-webpack-plugin": "^4.3.0",
   "sass": "^1.26.8",
   "sass-loader": "^8.0.2",
   "style-loader": "^1.2.1",
   "svg-inline-loader": "^0.8.2",
   "webpack": "^4.43.0",
   "webpack-cli": "^3.3.12",
   "webpack-dev-server": "^3.11.0"
 },
 "dependencies": {
   "@material-ui/core": "^4.10.2",
   "@material-ui/icons": "^4.9.1",
   "react": "^16.13.1",
   "react-dom": "^16.13.1",
   "react-router-dom": "^5.2.0"
 }
}
источник

V

Vova in JS Liberty [ОЫ]
Я пока только учусь) экспереминтирую
источник

В

Виктория in JS Liberty [ОЫ]
Vova
{
       test: /\.svg$/,
       loader: 'svg-inline-loader'
     }
я просто это прописал и все
Боль
источник

V

Vova in JS Liberty [ОЫ]
const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');

module.exports = {
 mode: 'development',
 entry: './src/index.js',
 output: {
   path: path.resolve(__dirname, 'dist'),
   filename: 'bundle.js',
   publicPath: '/'
 },
 devServer: {
   contentBase: path.join(__dirname, 'dist'),
   compress: true,
   port: 9000,
   historyApiFallback: true,
 },
 devtool: 'inline-source-map',
 module: {
   rules: [
     {
       test: /\.html$/i,
       loader: 'html-loader',
     },
     {
       test: /\.(js|jsx)$/,
       exclude: /node_modules/,
       use: {
         loader: 'babel-loader',
         options: {
           cacheDirectory: true
         }
       }
     },
     {
       test: /\.s[ac]ss$/i,
       use: [
         'style-loader',
         'css-loader',
         'sass-loader'
       ],
     },
     {
       test: /\.svg$/,
       loader: 'svg-inline-loader'
     }
   ],
 },
 plugins: [
   new HtmlWebpackPlugin({
     template: './src/index.html'
   })
 ]
};
источник

S

Syntax Highlight Bot in JS Liberty [ОЫ]
Vova
const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');

module.exports = {
 mode: 'development',
 entry: './src/index.js',
 output: {
   path: path.resolve(__dirname, 'dist'),
   filename: 'bundle.js',
   publicPath: '/'
 },
 devServer: {
   contentBase: path.join(__dirname, 'dist'),
   compress: true,
   port: 9000,
   historyApiFallback: true,
 },
 devtool: 'inline-source-map',
 module: {
   rules: [
     {
       test: /\.html$/i,
       loader: 'html-loader',
     },
     {
       test: /\.(js|jsx)$/,
       exclude: /node_modules/,
       use: {
         loader: 'babel-loader',
         options: {
           cacheDirectory: true
         }
       }
     },
     {
       test: /\.s[ac]ss$/i,
       use: [
         'style-loader',
         'css-loader',
         'sass-loader'
       ],
     },
     {
       test: /\.svg$/,
       loader: 'svg-inline-loader'
     }
   ],
 },
 plugins: [
   new HtmlWebpackPlugin({
     template: './src/index.html'
   })
 ]
};
источник

V

Vova in JS Liberty [ОЫ]
why??
источник

T

Th0r in JS Liberty [ОЫ]
Vova
Я пока только учусь) экспереминтирую
а в проекте то код есть, или одна страница и всё?
источник

V

Vova in JS Liberty [ОЫ]
Th0r
а в проекте то код есть, или одна страница и всё?
источник

V

Vova in JS Liberty [ОЫ]
пока только так
источник

В

Виктория in JS Liberty [ОЫ]
Аркаша Одесский 🇪🇪
В кра такого не было по моему...
Да.
Я весь конфиг cra перешароёбила, там такого нет
источник

T

Th0r in JS Liberty [ОЫ]
Vova
ясно. ну всё неиспользуемое надо удалять, мегабайт это пздц. читай про code-splitting и tree-shaking
источник

В

Виктория in JS Liberty [ОЫ]
Виктория
Да.
Я весь конфиг cra перешароёбила, там такого нет
И да, кстати, код там уебищный, конечно
источник