Size: a a a

Webpack — русскоговорящее сообщество

2020 January 12

В

Вадим in Webpack — русскоговорящее сообщество
Алексей
Включил сорс-мапы, можно для этого пути сделать как-то более читаемый вид? сейчас путь идет от корня операционной, можно задать чтобы от корня проекта шло?
Путь от корня сайта указывается т.к. броузер о вашей машине и понятия не имеет - он скачивает мапы с сайта
источник

А

Алексей in Webpack — русскоговорящее сообщество
ну ты же видишь что название папки далеко не корень сайта?)
источник

В

Вадим in Webpack — русскоговорящее сообщество
Путь к мапам прописывется в самих файлах проекта в виде коментариев - покажи что там
источник

А

Алексей in Webpack — русскоговорящее сообщество
код пэн накидать или прямо в чатик?
источник

В

Вадим in Webpack — русскоговорящее сообщество
Да можно и тут
источник

А

Алексей in Webpack — русскоговорящее сообщество
const merge = require('webpack-merge');
const webpack = require('webpack');
const path = require('path');

const cacheDir = path.resolve(__dirname, 'node_modules', '.cache');

const getThreadLoader = name => ({
loader: 'thread-loader',
options: {
 workerParallelJobs: 50,
 poolRespawn: false,
 name
}
});


const baseWebpackConfig = require('./webpack.base.config');
const devWebpackConfig = merge(baseWebpackConfig, {
// DEV config
mode: "development",
output: {
 filename: js/[name].js, // имя файла
},
devtool: "cheap-module-eval-source-map", // подключаем сорс мапы для отладки
devServer: {
 // настройки дев серва
 host: "localhost", // default
 contentBase: baseWebpackConfig.externals.PATH_BUILD,
 port: "8081", // 8080 по дефолту (у докера такой же), поэтому заменил порт
 overlay: {
  warnings: true,
  errors: true
 },
 proxy: {
  '/**': {
   target: 'http://localhost:8081/region.html',
   pathRewrite: {
    '.*': ''
   }
  }
 },
 progress: true,
 inline: true,
 quiet: true,
 compress: true,
 historyApiFallback: true,
 hot: true,
 open: true
},

// Пересборка при изменениях и уменьшение задержки перед ней
watch: true,
watchOptions: {
 aggregateTimeout: 100
},

module: {
 rules: [{
   // правила для модулей
   test: /\.js$/, // какие файлы обрабатывать
   exclude: "/node_modules/", // исключаем файлы, тк библиотеки прогоняются через бабель
   use: [{
     loader: 'cache-loader',
     options: {
      cacheDirectory: path.resolve(cacheDir, 'js')
     }
    },
    getThreadLoader('js'), {
     loader: 'babel-loader',
     options: {
      cacheDirectory: path.resolve(cacheDir, 'babel')
     }
    }
   ]
  },
  {
   test: /\.scss$/,
   use: [
    {
     loader: 'cache-loader',
     options: {
      cacheDirectory: path.resolve(cacheDir, 'css')
     }
    },
    getThreadLoader('css'),
    'style-loader',
    {
     loader: 'css-loader',
     options: {
      sourceMap: true,
      importLoaders: 3,
     }
    },
    {
     loader: 'postcss-loader',
     options: {
      sourceMap: true,
     }
    },
    {
     loader: 'sass-loader',
     options: {
      sourceMap: true,
     }
    },
    'import-glob-loader'
   ]
  }
 ]
},

plugins: [
 new webpack.HotModuleReplacementPlugin(),
 new webpack.SourceMapDevToolPlugin({
  filename: "[file].map",
 }),
]
});

module.exports = new Promise((resolve, reject) => {
resolve(devWebpackConfig)
})
источник

А

Алексей in Webpack — русскоговорящее сообщество
или ты про коменты в стилях в формате base64?
источник

В

Вадим in Webpack — русскоговорящее сообщество
Возможно у SourceMapDevToolPlugin
Нужно указать путь - посмотри в опциях у плагина или добавь ./ перед [file]
источник

В

Вадим in Webpack — русскоговорящее сообщество
Вообще нужно в output указать бы папку куда складывать ассеты
источник

А

Алексей in Webpack — русскоговорящее сообщество
с сорсмап плагином вообще странно, такое чувство что он вообще ни на что не влияет :D
источник

А

Алексей in Webpack — русскоговорящее сообщество
Вадим
Вообще нужно в output указать бы папку куда складывать ассеты
там указано, но в другом конфиге
источник

А

Алексей in Webpack — русскоговорящее сообщество
output: {
 path: './build', // папка куда кладем
 publicPath: "/" // относительная ссылка на файл который будет подставляться из браузера
},
источник

В

Вадим in Webpack — русскоговорящее сообщество
Странно - я в проекте использовал этот плагин для указания ему чтобы мапы указывали на localhost чтобы в проде они не тягались и все работало нормально
источник

В

Вадим in Webpack — русскоговорящее сообщество
Доберусь до компа - гляну как было в конфиге
источник

А

Алексей in Webpack — русскоговорящее сообщество
хмммм
источник

А

Алексей in Webpack — русскоговорящее сообщество
окей, спасиб
источник

В

Вадим in Webpack — русскоговорящее сообщество
А ты случайно в девтулзах не делал маппинг файлов проекта ?
источник

А

Алексей in Webpack — русскоговорящее сообщество
devtool: "cheap-module-eval-source-map", // подключаем сорс

делал
источник

В

Вадим in Webpack — русскоговорящее сообщество
Нет там немного не то.... значит не делал - отпала версия )
источник

В

Вадим in Webpack — русскоговорящее сообщество
Алексей
devtool: "cheap-module-eval-source-map", // подключаем сорс

делал
new webpack.SourceMapDevToolPlugin({
           columns: false,
           filename: '[file].map',
           publicPath: 'https://localhost:4430/',
           append: false,
       }),
источник