Ответы пользователя по тегу Фронтенд
  • Как отключить кэширование браузером index страницы?

    sasha-hohloma
    @sasha-hohloma
    Fullstack Developer
    Вам нужно добавлять hash в названия файлов. При изменении содержимого будет меняться hash рядом с именем файла скриптов/стилей и после нового релиза пользователи без сброса кэша будут видеть обновления. Совсем отключать кэш нежелательно, т.к. тогда постоянным пользователям нужно будет каждый раз грузить файлы и каждый раз ждать окончание загрузки.
    Для реализации такого подхода нужно настроить Webpack, подробнее можно глянуть в документации или в пример ниже для Webpack 5 с одного из рабочих проектов:

    const path = require('path');
    const htmlPlugin = require('html-webpack-plugin');
    
    const publicPath = path.join(__dirname, 'build');
    
    module.exports = {
        entry: './source/index.tsx',
        output: {
            path: publicPath,
            filename: '[name].[contenthash].js',
            chunkFilename: '[name].[chunkhash].js',
            publicPath: '/',
        },
        devServer: {
            static: publicPath,
            historyApiFallback: true,
            hot: true,
            port: 6790,
        },
        resolve: {
            extensions: ['.ts', '.tsx', '.js', '.jsx', 'ttf'],
        },
        module: {
            rules: [
                {
                    test: /\.(ts|tsx)$/,
                    include: path.resolve(__dirname, 'source'),
                    loader: 'ts-loader',
                    options: {
                        transpileOnly: true,
                    },
                },
            ]
        },
        plugins: [
            new htmlPlugin({
                publicPath: '/',
                template: './source/index.html',
                favicon: './source/assets/images/favicon.png'
            }),
        ],
    };
    Ответ написан
    Комментировать