Question

我正在尝试使用webpack使用ejs重构HTML页面。使用下面的配置我收到错误。

模块构建失败：SyntaxError：意外的令牌。

webpack.config.js

const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');


module.exports = {
    context: __dirname + "/src",
    entry: ['./pages/index.ejx'],
    output: {
            path: __dirname + "/dist",
            filename: "[name].bundle.js",
            chunkFilename: "[id].bundle.js"         
    },  
    plugins: [
        new HtmlWebpackPlugin({ template: 'pages/index.ejs'})
    ]
}

index.ejs

<!DOCTYPE html>
<html>
    <% include ..partials/head %>

    <% include ..partials/body %>
</html>

Answer 1

到目前为止，此配置似乎有效：

const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');


module.exports = {
    context: __dirname + "/src",
    entry: ['./index.ejs'],
    output: {
            path: __dirname + "/dist",
            filename: "[name].bundle.js",
            chunkFilename: "[id].bundle.js"         
    },
    module: {
        rules: [
            { test: /\.ejs$/, loader: "ejs-render-loader" } 

        ]
    },  
        plugins: [
            new HtmlWebpackPlugin({
                template: 'index.ejs'
            })
        ]
}

使用ejs加载器的webpack

1 个答案: