Странные символы в консоли Ошибка с Webpack & React - PullRequest
0 голосов
/ 08 апреля 2020

Редактировать : я использую Firefox в качестве браузера. Просто добавив это туда , в случае это не из настройки веб-пакета, а из браузера.

Я использую настройку веб-пакета с React & PHP и всякий раз, когда возникает ошибка в моем коде React вместо отображения ошибки чтения в консоли браузера отображаются странные символы: enter image description here Я попытался включить devtool в моем webpack.config, но ничего не изменилось.

Версия Webpack: 4.42.1 Вот мой файл webpack.config, на случай, если он поможет: «используйте строгий»;

const webpack = require('webpack');
const path = require('path');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const Dotenv = require('dotenv-webpack');

    let config = {
        entry: {
            main: [
                './_devapp/app.js',
                './_devapp/css/app.scss'
            ]
        },
        output: {
            path: path.resolve(__dirname, 'assets', 'bundle'),
            filename: '[name].bundle.js'
        },
        resolve: {
            extensions: ['.js', '.jsx', '.json', '.ts', '.tsx']
        },
        devtool: "source-map",
        module: {
            rules: [
                {
                    test: /\.(js|jsx|tsx|ts)$/,
                    exclude:path.resolve(__dirname, 'node_modules'),
                    use: {
                    loader: 'babel-loader',
                    options: {
                        presets: [
                                '@babel/preset-env',
                                '@babel/preset-react',
                                '@babel/preset-typescript'
                            ],
                            plugins : [
                                ["@babel/plugin-proposal-decorators", { "legacy": true }],
                                '@babel/plugin-syntax-dynamic-import',
                                ['@babel/plugin-proposal-class-properties', { "loose": true }]
                            ]
                        }
                    },
                },
                {
                    test: /\.scss$/,
                    use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: [
                            {
                                loader: 'css-loader',
                            },
                            'postcss-loader',
                            'sass-loader'
                        ]
                    })
                },
                {
                    test: /.(png|woff(2)?|eot|ttf|svg|gif)(\?[a-z0-9=\.]+)?$/,
                    use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: '../css/[hash].[ext]'
                        }
                    }
                    ]
                },
                {
                    test : /\.css$/,
                    use: ['style-loader', 'css-loader', 'postcss-loader']
                }
            ]
        },
        externals: {
        },
        plugins: [
            new ExtractTextPlugin(path.join('..', 'css', 'app.css')),
            new webpack.DefinePlugin({
                '__DEV__' : JSON.stringify(true),
                '__API_HOST__' : JSON.stringify('http://localhost/project-glis/'),

            }),
            new Dotenv({
                path: './.env', // Path to .env file (this is the default)
              }),
        ],

    };

    if (process.env.NODE_ENV === 'production') {
        config.plugins.push(
            new webpack.optimize.UglifyJsPlugin({
                sourceMap: false,
                compress: {
                    sequences: true,
                    conditionals: true,
                    booleans: true,
                    if_return: true,
                    join_vars: true,
                    drop_console: true
                },
                output: {
                    comments: false
                },
                minimize: true
            })
        );
    }

    module.exports = config;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...