Question

我有以下webpack配置，在添加了flowtype-loader之后，webpack不会重新编译文件保存。我有什么想法可以尝试吗？没有装载机，它可以很好地工作。

import path from 'path';
import webpack from 'webpack';
import ExtractTextPlugin from 'extract-text-webpack-plugin';
import FlowtypePlugin from 'flowtype-loader/plugin';

export default {
    entry:{
        app: [
            './src/application.js',
            './ui-kit/src/scss/main.scss'
        ],
        vendor: [
            'jed',
            'decentstringformatter'
        ]
    },
    historyApiFallback: true,
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: 'application.js'
    },
    resolve: {
        extensions: ['', '.js', '.jsx']
    },
    module: {
        preLoaders: [
            { test: /\.js(x?)$/, loader: "flowtype", exclude: /node_modules/ }
        ],
        loaders: [
            {
                test: /\.js(x?)$/,
                loaders: [
                    "babel-loader?{presets:[['es2015',{modules:false}],'stage-0','react']}"
                ],
                include: path.join(__dirname, 'src')
            },
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract('css!autoprefixer?{browsers:["last 10 versions", "Chrome >= 4","Firefox >= 2", "Explorer >= 8"]}!sass')
            }

        ]
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new ExtractTextPlugin('application.css', {
            allChunks: true
        }),
        new webpack.optimize.DedupePlugin(),
        new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js'),
        new FlowtypePlugin()
    ]
};

以下是webpack-dev-server选项

var myConfig = Object.assign(webpackOptions);
    myConfig.devtool = 'eval';
    myConfig.debug = true;
    myConfig.entry.app.unshift('webpack-dev-server/client?'+ devEnvEndpoint);
    myConfig.entry.app.unshift('webpack/hot/dev-server');
    var compiler = webpack(myConfig);
    var devServer = new WebpackDevServer(compiler, {
        publicPath: myConfig.output.publicPath,
        hot: true,
        inline: true,
        headers: { 'Access-Control-Allow-Origin': '*' },
        contentBase: devEnvHost,
        stats: {
            colors: true
        },
        proxy: {
            '**' : {
                target: devEnvHost,
                changeOrigin: true
            }
        }
    });

Answer 1

好的，我解决了这个by using https://www.npmjs.com/package/babel-plugin-typecheck而不是加载器

这是我的.babelrc并且它工作正常，重新编译并检查类型。

{
  "presets": ["react", "es2015"],
  "plugins": ["typecheck", "react-hot-loader/babel"]
}

添加Flowtype加载程序后，Webpack不会重新编译/重新加载

1 个答案: