小编Are*_*yan的帖子

我是React的新手,所以请不要严格判断.我在服务器上渲染我的React应用程序,并希望在前端执行代码.应用程序正确地呈现样式并且没有警告或错误,但是由于我使用的API应该在正面执行,现在可以使用空状态.

据我了解服务器渲染组件,因为服务器渲染和安装组件在服务器上,它不是调用componentDidMount()方法,应该做我的API调用和其他工作人员

这是我的组成部分

import React from 'react';
import {render} from 'react-dom';
import SpComparison from './spComparison.jsx';
import Comparison from './comparison.jsx';
import AnalystRatings from './analystRatings.jsx';


export default class Insights extends React.Component {
constructor(props){
    super(props);
    this.state = {
       charts: []
    }

    let _this = this;
}

componentDidMount() {
    console.log("I want to do log on front end side, but can't")
}

render () {
    let charts = this.state.charts.map(function(i){
        if (i.type == 'comparison'){
            return <Comparison key={ i.id } config={ i.config } />
        } …

我正在创建基于NodeJS的爬虫,它正在使用node-cron包,我需要阻止进入脚本退出,因为应用程序应该永远作为cron运行,并将在特定时间段使用日志执行爬虫.

在Web应用程序中,服务器将监听并阻止终止,但在无服务器应用程序中,它将在执行所有代码后退出程序,并且不会等待crons.

我应该while(true)为此编写循环吗？为此目的,节点中的最佳实践是什么？

提前致谢!

我是webpack 2的新手并且它是延迟加载的,到目前为止我已经创建了没有延迟加载和代码拆分的项目,但是现在想要将我的代码拆分成块并使用React Router进行系统导入.我根据这篇文章创建了React Router部分

这个webpack 2配置文件如下.

let webpack = require('webpack');
let path = require('path');
let ExtractTextPlugin = require('extract-text-webpack-plugin');

var devFlagPlugin = new webpack.DefinePlugin({
    __DEV__: JSON.stringify(JSON.parse(process.env.DEBUG || 'false')),
    'process.env': {
        NODE_ENV: JSON.stringify(process.env.NODE_ENV || 'development'),
    }
});

let extractSCSS = new ExtractTextPlugin('[name].css')

module.exports = {
    context: __dirname,
    entry: {
        bundle: './src/app/app-client.jsx',
        styles: './src/app/sass/main.scss',
        vendor: [
            'react', 'react-dom'
        ]
    },
    output: {
        filename: '[name].js',
        chunkFilename: 'chunk.[id].[chunkhash:8].js',
        path: './src/build',
    },
    resolve: {
        extensions: ['.js', '.jsx']
    },
    devtool: 'cheap-module-source-map',
    module : {
        rules …

是否可以使用 Chart.js 在栏的末尾显示图标，如下图所示？

我进行了一些搜索，但找不到任何与此相关的内容。

最近我们将 webpack 更新到了 v4，很快就注意到 webpack 在开发过程中出现了意外错误，这些错误在重建整个包后消失了。

我们的应用程序使用延迟加载和代码分割进行构建，这可能会导致问题，尽管我在官方文档中找不到与此相关的任何内容。

这是我们得到的错误

react_devtools_backend.js:2273 TypeError: Cannot read property 'call' of undefined

我们的 webpack webpack.config.js文件。

const webpack = require('webpack');
const path = require('path');
const glob = require('glob');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const AssetsPlugin = require('assets-webpack-plugin');
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
// minification plugins
const TerserJSPlugin = require('terser-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
// image optimization plugins
const ImageminPlugin = require("imagemin-webpack-plugin").default;
const imageminGifsicle = require("imagemin-gifsicle");
const imageminPngquant = require("imagemin-pngquant");
const imageminSvgo = …

我有一个项目，仅出于一个原因使用react-router v3。原因是需要使用数据预取的服务器端渲染，最方便的方法是将集中式路由配置保持在objector 中array并循环匹配元素以从服务器端的 API 获取数据。稍后的数据将与响应 HTML 一起传递给客户端，并存储在 JSON 格式字符串的变量中。

应用程序也使用代码拆分，但是通过babel-plugin-transform-ensure-ignore在服务器端使用，我可以直接获取组件而不是延迟加载，并且本机import方法将仅在客户端使用。

尽管如此，上述结构不适用于react-router v5，因为它有点困难，因为我不能使用@loadable/components，正如react-router官方文档所建议的那样。根据我的观察，@loadable/components只是在服务器端生成 HTML，而不是给我实现fetch负责服务器端逻辑的方法的组件。

所以想请教一下webpack + react-router v5 + ssr + data prefetch + redux + code splitting的好结构