Question

我正在玩webpack和Symfony 2。现在我已经让他们一起工作了。

当我保存js或css文件时，我的浏览器会自动重新加载webpack-dev-server。但是当我更改并保存Twig文件时，如何告诉webpack重新加载浏览器？

以下是我的项目结构：

root
├── app
│   ├── config
│   └── Resources
│       └── assets
│           └── img
│           └── js
│               └── index.js (my entry point)
│           └── scss (my styles files)
│       └── views (All my twig files are here)
├── src
│   └── AppBundle
├── nodes_modules
├── web
    ├── bundles
    └── build (generated files by webpack)
├── package.json
└── webpack.config.js

我的webpack配置：

...
module.exports = {
    entry: 'app/Resources/assets/js',
    output: {
        path: 'web/build',
        filename: '[name].js',
        chunkFilename: '[name].bundle.js',
        publicPath: '/build/',
        pathinfo: true
    }
    plugins: [
        new ExtractTextPlugin('styles.css', {allChunks: true}),
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: JSON.stringify('development')
            }
        }),
    ],
    module: {
        preLoaders: [
            {
                test: /\.js$/,
                loaders: ['eslint', 'jscs'],
                include: PATHS.app
            }
        ],
        loaders: [
            {test: /\.js$/, loader: 'babel?cacheDirectory'},
            {test: /\.css$/, loader: ExtractTextPlugin.extract('style', 'css')},
            {test: /\.scss$/, loader: ExtractTextPlugin.extract('css?sourceMap!sass?sourceMap')},
            {test: /\.(png|gif|jpe?g|svg|woff2?|eot|ttf)$/i, loader: 'url', query: {limit: 10000}}
        ]
    },
    resolve: {
        extensions: ['', '.js'],
        modulesDirectories: ['node_modules', '']
    }
    devServer: {
        contentBase: path.join(__dirname, 'web/'),
        historyApiFallback: true,
        stats: 'errors-only',
        host: '0.0.0.0',
        port: '8090'
    }
}

感谢您的任何建议。

Answer 1

没关系，

我发现了一个可以满足我想要的插件： https://github.com/man27382210/watchFile-webpack-plugin

非常感谢。

如何使用Webpack和Symfony观看twig文件？

1 个答案: