如何修复快速警告Webpack?

问题描述

我正在使用webpack限制服务器和客户端...

I am using webpack to boundle server and client...

这是webpack配置:

here is webpack config:

const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const WebpackNotifierPlugin = require('webpack-notifier');



module.exports = {
  entry: {
    server: './src/main.server.ts',
    client: './src/main.client.ts'
  },
  target: 'node',
  devtool: 'source-map',
  output: {
    path: path.resolve(__dirname, '../dist'),
    filename: '[name].js'
  },
  module: {
    loaders: [
      {
        test: /\.ts$/,
        loaders: ['awesome-typescript-loader', 'angular2-template-loader'],
        exclude: [/node_modules/, /\.(spec|e2e)\.ts$/]
      },
      {test: /\.html$/, loader: 'html-loader'}
    ]
  },
  plugins: [
    new WebpackNotifierPlugin({title: 'Angular files reloaded!!!'}),
    new webpack.ContextReplacementPlugin(
      /angular(\\|\/)core(\\|\/)@angular/,
      path.resolve('./src'),
      {}
    ),
    new HtmlWebpackPlugin({
      template: 'src/index.html'
    }),
    new CopyWebpackPlugin([
      {
        from: 'src/assets', to: 'assets'
      }
    ])
  ],
  resolve: {
    extensions: ['.js', '.ts', '.html']
  }
};

打字稿文件tsconfig.json:

typescript file, tsconfig.json:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es2015", "dom" ],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
    "allowSyntheticDefaultImports": true
  },
  "exclude": [
    "node_modules/*",
    "src/main.client-aot.ts",
    "src/main.client-closure.ts",
    "src/main.server-aot.ts"
  ]
}

并表达文件main.server.ts:

and express file, main.server.ts:

// polyfills
import 'zone.js/dist/zone-node';
import 'reflect-metadata';
import 'rxjs/Rx';

// angular

// libs
import * as express from 'express';
import * as compression from 'compression';
import { ngExpressEngine } from '@nguniversal/express-engine';

// module
import { AppServerModule } from './app/app.server.module';

const server = express();
server.use(compression());

/**
 * Set view engine
 */
server.engine('html', ngExpressEngine({
  bootstrap: AppServerModule
}));

server.set('view engine', 'html');
server.set('views', '');

/**
 * Point static path to `public`
 */
server.use('/', express.static('./', {index: false}));

/**
 * Catch all routes and return the `index.html`
 */
server.get('*', (req: any, res: any) => {
  res.render('index.html', {
    req,
    res
  });
});

/**
 * Port & host settings
 */
const port = 8000;
const PORT = process.env.PORT || port;
const HOST = process.env.BASE_URL || 'localhost';
const baseUrl = `http://${HOST}:${PORT}`;

server.set('port', PORT);

/**
 * Begin listening
 */
server.listen(server.get('port'), () => {
  // tslint:disable-next-line
  console.log(`Express server listening on ${baseUrl}`);
});

我的服务器受到警告时:

When I boundle server get Warining:

如何删除?为什么会出现该警告?

How can I remove? Why that warning appear?

如果我使用 webpack-node-externals 警告会消失，但是我的代码无法正常工作.

If I use webpack-node-externals warining goes away, but my code not working.

有什么主意吗?

推荐答案

您可以将express声明为外部依赖项，因此Webpack不会捆绑该模块.

You can declare express as an external dependency, so Webpack does not bundle the module.

只需添加以下内容:

module.exports = {
    ...
    externals: {
        'express': 'commonjs express'
    }
    ...
};

这篇关于如何修复快速警告Webpack?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！