Nest: HMR example does not work with MVC example

Created on 19 Apr 2019  路  4Comments  路  Source: nestjs/nest

I integrated HMR example with MVC example and I cannot get it to work together

When I start
npm start

I see error below

[HMR] Cannot apply update. [HMR] Error: Aborted because ./src/app.controller.ts is not accepted Update propagation: ./src/app.controller.ts -> ./src/app.module.ts -> ./src/main.ts at hotApply (F:\dev\sandbox\cp-nest\dist\server.js:435:30) at F:\dev\sandbox\cp-nest\dist\server.js:273:22 [HMR] You need to restart the application! AppModule dependencies initialized InstanceLoader true AppController {/}: RoutesResolver true Mapped {/, GET} route RouterExplorer true

and when I fetch the request from browser I see

Nest application successfully started NestApplication true Failed to lookup view "index" in views directory "\views" Error: Failed to lookup view "index" in views directory "\views" at Function.render (F:\dev\sandbox\cp-nest\node_modules\express\lib\application.js:580:17) at ServerResponse.render (F:\dev\sandbox\cp-nest\node_modules\express\lib\response.js:1008:7) at ExpressAdapter.render (F:\dev\sandbox\cp-nest\node_modules\@nestjs\platform-express\adapters\express-adapter.js:29:25) at RouterResponseController.render (F:\dev\sandbox\cp-nest\node_modules\@nestjs\core\router\router-response-controller.js:14:29) ExceptionsHandler

my webpack.config.js looks like following

const webpack = require('webpack');
const path = require('path');
const nodeExternals = require('webpack-node-externals');

module.exports = {
    entry: ['webpack/hot/poll?100', './src/main.ts'],
    watch: true,
    target: 'node',
    externals: [
        nodeExternals({
            whitelist: ['webpack/hot/poll?100'],
        }),
    ],
    module: {
        rules: [
            {
                test: /.tsx?$/,
                use: 'ts-loader',
                exclude: /node_modules/,
            },
        ],
    },
    mode: 'development',
    resolve: {
        extensions: ['.tsx', '.ts', '.js'],
    },
    plugins: [new webpack.HotModuleReplacementPlugin()],
    output: {
        path: path.join(__dirname, 'dist'),
        filename: 'server.js',
    },
};

Any pointers will be great. Thanks.

needs clarification

Most helpful comment

I have encountered the same question.
If you log the "__dirname" variable, it outputs '/', so I use 'process.cwd()'.
Here is the code:
app.useStaticAssets(join(process.cwd(), './public')); app.setBaseViewsDir(join(process.cwd(), './views')); app.setViewEngine('hbs');
May it helps you.

All 4 comments

Please, provide a minimal repository which reproduces your issue (PS. first thought - you need an extra loader to handle template files by webpack)

I have encountered the same question.
If you log the "__dirname" variable, it outputs '/', so I use 'process.cwd()'.
Here is the code:
app.useStaticAssets(join(process.cwd(), './public')); app.setBaseViewsDir(join(process.cwd(), './views')); app.setViewEngine('hbs');
May it helps you.

path.join(__dirname + 'views')looks inside the server directory, so replace it with ./views Or in webpack setting add this option

node: {
    __dirname: true,
    __filename: true,
},

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings