• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript webpack-hot-middleware.default函数代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中webpack-hot-middleware.default函数的典型用法代码示例。如果您正苦于以下问题:TypeScript default函数的具体用法?TypeScript default怎么用?TypeScript default使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。



在下文中一共展示了default函数的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: function

export default function(): RequestHandler[] {

  const config = require('../../webpack').default;
  const compiler = timedCompiler(config);

  const serverOptions = {
    lazy: false,
    logLevel: 'silent',
    publicPath: config.output.publicPath || '/',
    headers: { 'Access-Control-Allow-Origin': '*' }
  };

  const devMiddleware = webpackDevMiddleware(compiler, serverOptions);

  const hotMiddleware = webpackHotMiddleware(compiler, {
    log: false, path: '/__webpack_hmr', heartbeat: 10 * 1000
  });

  const middlewares: RequestHandler[] = [
    devMiddleware,
    hotMiddleware
  ];

  return middlewares;
};
开发者ID:atSistemas,项目名称:angular-base,代码行数:25,代码来源:dev-middleware.ts


示例2: configureApp

  configureApp() {
    const { buildPath, multiCompiler } = this.options

    if (process.env.NODE_ENV === 'development') {
      this.app.use(errorOverlayMiddleware())
    }

    if (multiCompiler) {
      const webpackDevMiddleware = require('webpack-dev-middleware')
      const webpackHotMiddleware = require('webpack-hot-middleware')
      const webpackHotServerMiddleware = require('webpack-hot-server-middleware')

      const clientCompiler = (multiCompiler as any).compilers.find(
        (childCompiler: Compiler) => childCompiler.name === 'client'
      )

      this.app.use(
        webpackDevMiddleware(multiCompiler, {
          serverSideRender: true,
          index: false,
          quiet: true,
        })
      )

      this.app.use(webpackHotMiddleware(clientCompiler, { log: false }))

      this.app.use(
        webpackHotServerMiddleware(multiCompiler, {
          chunkName: 'index',
        })
      )
    } else if (buildPath) {
      // Serve a pre-built app.
      // Start by finding all the relevant files.
      const CLIENT_ASSETS_DIR = join(buildPath, 'static')
      const CLIENT_STATS_PATH = join(CLIENT_ASSETS_DIR, 'stats.json')
      const SERVER_RENDERER_PATH = join(buildPath, 'ssr')
      const SERVER_STATS_PATH = join(SERVER_RENDERER_PATH, 'stats.json')

      // Load server bundle and webpack stats.
      let serverRenderer = require(SERVER_RENDERER_PATH)
      serverRenderer = serverRenderer.__esModule
        ? serverRenderer.default
        : serverRenderer
      const clientStats = require(CLIENT_STATS_PATH)
      const serverStats = require(CLIENT_STATS_PATH)

      // Serve static files and server renderer.
      this.app.use(express.static(CLIENT_ASSETS_DIR, { index: false }))
      this.app.use(serverRenderer({ clientStats, serverStats }))
    } else {
      throw new Error(
        'Must pass either buildPath or webpack compiler to tux server.'
      )
    }
  }
开发者ID:aranja,项目名称:tux,代码行数:56,代码来源:Server.ts


示例3: express

export default function createApp
	( publicPath:string
	, contentBase:string
	, compiler:webpack.compiler.Compiler
	):SwappableExpress
	{
		const app = express() as SwappableExpress;
		const wrappedHandler = HandlerWrapper();

		app.use(webpackHotMiddleware(compiler));

		app.use(express.static(contentBase));
		
		app.use(wrappedHandler);

		app.swap = function(handler){
			wrappedHandler.swap(handler);
			return app;
		}

		return app;
	}
开发者ID:Xananax,项目名称:wpack,代码行数:22,代码来源:createApp.ts


示例4: startPublications

export function startPublications() {
  const mode = process.env.NODE_ENV || "DEVELOPMENT";
  const app = express();

  if (mode.toUpperCase() === "DEVELOPMENT") {
    const compiler = webpack(webpackConfig as webpack.Configuration);
    app.use(
      webpackDevMiddleware(compiler, {
        publicPath: webpackConfig.output.publicPath,
      })
    );
    app.use(webpackHotMiddleware(compiler));
    app.use("/playground", graphqlPlayground({ endpoint: "/graphql" }));
  } else {
    const publicPath = path.resolve(__dirname, "../public");
    app.use(express.static(publicPath));
    app.get("*", (req, res) =>
      res.sendFile(path.resolve(publicPath, "index.html"))
    );
  }

  app.use(jwt(jwtConfig));
  app.use(
    "/graphql",
    graphqlHttp(request => ({
      schema,
      context: { user: request.user },
    }))
  );
  app.use(onAuthError);
  app.get("/documents/:id/pdf", documentPdfHandler);
  app.listen(PORT, () => {
    console.log(`Publications started on port ${PORT}.`);
  });
}
开发者ID:carlospaelinck,项目名称:publications-js,代码行数:35,代码来源:index.ts


示例5: watchHot

// only for spa for now via opt-in (experimental feature)
async function watchHot() {
  if (project.ws.i18n) {
    await compileI18n();
  }

  const config = getSpaBuildConfig();
  const { index } = config.entry;
  config.entry.index = [
    'react-hot-loader/patch',
    resolve('webpack-hot-middleware/client')
  ].concat(Array.isArray(index) ? index : [index]);
  config.plugins = config.plugins || [];
  config.plugins.push(new HotModuleReplacementPlugin());
  const compiler = getCompiler(config, 'build');

  const middlewares: Array<any> = [
    webpackDevMiddleware(compiler, {
      publicPath: project.ws.publicPath,
      stats: getStatsOptions(),
      noInfo: true
    }),
    webpackHotMiddleware(compiler)
  ];
  await listenAsync(middlewares);
}
开发者ID:otbe,项目名称:ws,代码行数:26,代码来源:watch.ts


示例6: patchWebConfigWithHMR

export const createMiddlewaresForWebpack = (
  webpackConfig: webpack.Configuration,
  index: string,
  hot: boolean = false
) => {

  const patchedWebpackConfig = hot
    ? patchWebConfigWithHMR(webpackConfig)
    : webpackConfig;

  const bundler = webpack(patchedWebpackConfig);

  const fs = new MemoryFS();

  bundler.outputFileSystem = fs;

  const devMiddleware = webpackDevMiddleware(bundler, {
    publicPath: (patchedWebpackConfig.output || {}).publicPath!,

    stats: patchedWebpackConfig.stats || {
      colors: true,
      reasons: false,
      hash: false,
      version: false,
      timings: true,
      chunks: false,
      chunkModules: false,
      cached: false
    }
  });

  const devServerMiddlewares = [
    devMiddleware,
    ((req, res, next) => {
      if (req.method === "GET" && req.url === "/") {
        devMiddleware.waitUntilValid(() => {
          const indexFile = path.join(webpackConfig.output!.path!, index);
          res.end(fs.readFileSync(indexFile));
        });
      } else {
        next();
      }
    }) as browserSync.MiddlewareHandler
  ];

  if (hot) {
    return [
      ...devServerMiddlewares,
      webpackHotMiddleware(bundler)
    ];
  }

  return devServerMiddlewares;
};
开发者ID:morlay,项目名称:webpack-browser-sync,代码行数:54,代码来源:WebpackOptions.ts


示例7: require

if (config.development) {
  // tslint:disable
  const webpackDevMiddleware = require('webpack-dev-middleware');
  const webpackHotMiddleware = require('webpack-hot-middleware');
  const webpackConfig = require('../webpack.config');
  // tslint:enable

  const compiler = webpack(webpackConfig);
  app.use(webpackDevMiddleware(compiler, {
    noInfo: true,
    publicPath: webpackConfig.output.publicPath,
    stats: { chunks: false },
  }));
  app.use('/assets', express.static(path.join(__dirname, '..', 'assets')));

  app.use(webpackHotMiddleware(compiler));
} else {
  app.use(compression());
  app.use('/dist', express.static(path.join(__dirname, '..', 'dist')));
  app.use('/assets', express.static(path.join(__dirname, '..', 'assets')));
}

const createPictureData = (picture) => {
  let sources;
  if (picture.sources) {
    sources = picture.sources.map((source) => ({
      url: url.resolve(config.aws.cloudfrontHost, source.filename),
      width: source.width,
    }));
  } else {
    const [base, extension] = picture.filename.split('.');
开发者ID:threehams,项目名称:fancy-pants-portfolio,代码行数:31,代码来源:server.ts


示例8: require

  }

  // Dev-only middleware

  const webpack = require('webpack')
  const compiler = webpack(require('../config/webpack.config.js'))
  const hot = require('webpack-hot-middleware')
  const devserver = require('webpack-dev-middleware')

  server.use(devserver(compiler, {
    publicPath: '/',
    stats: { colors: true },
    historyApiFallback: true,
  }))

  server.use(hot(compiler))

} else {
  // Production-only middleware

  const helmet = require('helmet')
  server.use(helmet())
}

server.use(renderMiddleware(app))

const port = process.env.PORT || 8000
server.listen(port, () => {
  console.log(`Application started on port ${port}`)
})
开发者ID:chrisdevereux,项目名称:ts-react,代码行数:30,代码来源:server.ts


示例9: webpack

//   });
// }


const compiler = webpack(config({ PORT, HOST, PROD: false }));

const devMiddlewareConfig: webpackDevMiddlewareExtendedOptions = {
  quiet: false,
  reload: true,
  overlay: true,
  noInfo: true,
  publicPath: null,
}

const devMiddleware = webpackDevMiddleware(compiler, devMiddlewareConfig);
const hotMiddleware = webpackHotMiddleware(compiler);

const app = express();

app.use(devMiddleware);
app.use(hotMiddleware);

app.use(express.static(DIST_PATH));

console.log("Running in Path: " + DIST_PATH)

const server = app.listen(PORT, HOST, (error: Error) => {

  if (error) {
    return console.error(error);
  }
开发者ID:tobiasbu,项目名称:tobiJS,代码行数:31,代码来源:dev_server.ts


示例10: webpack

import webpackDevMiddleware from "webpack-dev-middleware";
import webpackHotMiddleware from "webpack-hot-middleware";
import App from "./App/App";

// @ts-ignore
import clientConfig from "../../client/webpack.config.js";

const compiler = webpack(clientConfig);
const options = {
    logLevel: 'warn',
    publicPath: clientConfig.output.publicPath,
};

const app = express();

app.use(webpackDevMiddleware(compiler, options));

// @ts-ignore
app.use((webpackHotMiddleware)(compiler, {
    heartbeat: 10 * 1000,
    log: console.log,
    path: "/__webpack_hmr",
}));

app.listen(
    3000,
    () => {
        console.log("Example app listening on port 3000!\n");
    },
);
开发者ID:NickKelly1,项目名称:Typescript-Front-And-Back-with-Webpack-Hot-Realoder-Template,代码行数:30,代码来源:server.ts



注:本文中的webpack-hot-middleware.default函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript webpack-merge.default函数代码示例发布时间:2022-05-25
下一篇:
TypeScript webpack-dev-server.listen函数代码示例发布时间:2022-05-25
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap