webpack-dev-server提示not cacheable无法热更新;内附配置;

发布于 2022-09-05 08:55:38 字数 2230 浏览 21 评论 0

1.我的问题;
使用antd-mobile做项目,之前用antd时配置的webpack都没问题。然而到了mobile里面加载了几个必须,第一.svg的使用配置,第二.按需加载的依赖,第三.分离mobile的rn和web模式;
以上只修改了这几个配置点;
现在使用webpack-dev-server --inline --hot 时就报错我写的js not cacheable;但是可以访问到目标页面。只是无法热更新了;

2.webpack配置;
高级配置还不会,暂时就用到这些;


const webpack = require('webpack');
const path = require('path');
const autoprefixer = require('autoprefixer');
const pxtorem = require('postcss-pxtorem');

module.exports = {
    context: __dirname + '/src',
    entry: './js/root.js',
    resolve: {
        modulesDirectories: ['node_modules', path.join(__dirname, '../node_modules')],
        extensions: ['.web.js', '', '.jsx', '.js', '.json']
    },
    module: {
        loaders: [{
            test: /\.(js|jsx)$/,
            exclude: /(node_modules)/,
            loader: 'babel-loader',
            query: {
                plugins: [
                    'external-helpers',
                    ["transform-runtime", {polyfill: false}],
                    ["import", [{ "style": "css", "libraryName": "antd" },{"style": "css", "libraryName": "antd-mobile"}]]
                ],
                presets: ['es2015', 'react']
            }
        },
            {
                test: /\.css$/,
                loader: 'style-loader!css-loader'
            },
            {
                test: /\.less$/i,
                loader: 'style-loader!less-loader',
            },
            {
                test: /\.(svg)$/i,
                loader: 'svg-sprite-loader',
                include: [
                require.resolve('antd-mobile').replace(/warn\.js$/, ''),  // 1. 属于 antd-mobile 内置 svg 文件
                // path.resolve(__dirname, '.src/my-svg'),  // 自己私人的 svg 存放目录
            ]},]
    },
    postcss: [
        autoprefixer({
            browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8', 'iOS >= 8', 'Android >= 4'],
        }),
        pxtorem({ rootValue: 100, propWhiteList: [] })
    ],
    output: {  //输出位置;
        path: __dirname + '/src/',//路径;
        filename: 'bundle.js'
    }
}

报错:
图片描述

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文