Question

把手在服务器端工作正常，但是当我在视图中调用Handelbars.compile(xxx)时出现错误ReferenceError: Handlebars is not defined

我在我的js条目文件中添加了import Handlebars from 'handlebars';。现在，当我查看捆绑软件的来源并且以前没有时，可以看到对把手的引用。我想我走的很好，但是我仍然有错误ReferenceError: Handlebars is not defined。

我的webpack conf文件：

const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
// https://github.com/webpack-contrib/mini-css-extract-plugin

module.exports = {
    mode: 'production',
    entry: {
       app: './assets/js/app.js',
       guests: './assets/js/guests.js'
    },
    output: {
       path: path.resolve(__dirname, 'public/dist'),
       filename: 'js/[name].js' // template based on keys in entry above (index.js & admin.js)
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: [
                    {
                        loader: MiniCssExtractPlugin.loader,
                        options: {
                            publicPath: '../',
                            hmr: process.env.NODE_ENV === 'development',
                        },
                    },
                    'css-loader',

                ],
            },
            {
                // include images in compilation, needed for jQuery UI
                test: /\.(png|jpg|gif)$/i,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            limit: 100000,
                        },
                    },
                    {
                        loader:'file-loader',
                        options:{
                            name:'[name].[ext]',
                            outputPath:'images/' 
                        }
                    }
                ],
            },
            {
                // include fonts in compilation, needed for jQuery UI
                test: /\.(ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/,
                use: [
                    {
                        loader:"file-loader",
                        options:{
                            name:'[name].[ext]',
                            outputPath:'fonts/' 
                        }
                    }
                ],
            }
        ]
    },
    plugins: [
        new MiniCssExtractPlugin({
            filename: 'css/[name].css',
            chunkFilename: '[name]-[id].css',
            ignoreOrder: false,
        })
    ],
    resolve: {
        alias: {
            'jquery': "jquery/src/jquery",
            //'handlebars/runtime': 'handlebars/dist/cjs/handlebars.runtime.js',
            //'handlebars': 'handlebars/dist/cjs/handlebars.js',
            //'handlebars' : 'handlebars/dist/handlebars.js'
        }
    }
};

我的app.js（入口文件）：

// Import CSS
import 'bootstrap/dist/css/bootstrap.css';
import '../css/bootstrap-glyphicons.css';
import '../css/style.css';

// Import JS
import 'bootstrap/dist/js/bootstrap.js';
import Handlebars from 'handlebars';

我是webpack的新手，我显然缺少一些东西，但是我需要帮助才能知道结果。谢谢

Nodejs /把手/ Webpack：ReferenceError：把手未定义

0 个答案: