jjzjj

WebPack-Dev-Server

全部标签

javascript - 如何在没有 bundler 的情况下使用 Babel,但具有类似于 webpack 的开发体验?

我正在尝试使用ES6modules构建一个新项目没有捆绑。我还是想用babel-7将TypeScript和JSX翻译成JS。我发现很难弄清楚如何为它设置开发服务器。我找不到任何类似于webpack-dev-server的“babel-dev-server”(热模块重新加载、浏览器同步、文件观察器)。一种可能是使用browsersync作为静态服务器,例如dist并并行运行类似babelsrc--out-dirdist--watch的东西。但这不包括热重载,对我来说似乎有点笨拙。此外,如果您可以为JS文件提供哈希以更好地控制缓存,那么它对于构建和开发步骤仍然有用。或者我可以配置像webp

javascript - 如何设置 VSCode 来调试 webpack 捆绑的 nodejs 服务器

我有一个nodejsexpress应用程序,我试图将其与webpack4(加上babel7.1.0)捆绑在一起。我遵循了这两篇文章中的一些设置:WebpackJavascriptBundlingforBothFront-endandBack-end(nodejs)CreatingaserverbundlewithWebpackforuniversalrendering我可以在捆绑后构建和运行服务器,但我希望能够使用VSCode的调试环境对其进行调试。我尝试了以下webpack和vscode配置的组合,但它没有设置断点或让我进入代码。.vscode/launch.json{"type":

javascript - 使用 WebPack,我如何创建准备好使用 "split" bundle ,其中一个依赖于另一个?

我的问题非常接近others我相信的答案仍然需要我想避免的另一个WebPack步骤。但首先是故事:我有一个Node模块(我们称之为libfoo),它提供了一些功能并需要一些第三方模块,和一个小脚本main.js,它提供主要入口点并需要libfoo:ma​​in.js:constfoo=require('foo');functionmain(){foo.bar();}main();我现在想使用WebPack将libfoo和main.js转换为浏览器可执行文件可交付成果。我希望libfoo(相当大)静态驻留在目标系统上,而main.js非常小并且变化很快(试想一个测试场景,其中libfoo

javascript - 如何在 webpack hook 中打破循环

我正在处理一个nuxt.js项目,我需要在每个更改的文件(即每个webpack构建)上运行一个shell脚本。所以我正在使用WebpackHooks我创建了我的WebpackPlugin/plugins/NamedExports.jsconstpluginName='NamedExports'const{exec}=require('child_process')classNamedExports{apply(compiler){compiler.hooks.beforeCompile.tap(pluginName,(params,callback)=>{exec('shplugins

javascript - 如何绕过 Firefox 扩展 "server does not support RFC 5746"中的以下错误

我正在开发FireFox扩展当我对安全服务器执行xhr时,特别是POST数据它给出状态500和以下消息:onsip.highrisehq.com:serverdoesnotsupportRFC5746,seeCVE-2009-3555我怎样才能绕过它?我假设这是因为服务器配置错误,但我等不及37signal的人来修复它。谢谢你的帮助 最佳答案 好吧-“参见CVE-2009-3555”。基本上这是一个服务器端漏洞,可能会危及TLS/SSLsession。在37signals更新他们的服务器之前,我不确定您可以在客户端做些什么来解决这个

javascript - 使用 Webpack 时框架黑盒化?

是否可以对WebPackbundle的某些部分进行Blackbox,以便Chrome不显示框架内部的堆栈跟踪?例如,在检查React应用程序上的错误时,我不关心框架内的堆栈跟踪条目,而我只想查看与我编写的代码相关的部分。当使用单个文件时,这可以通过“FrameworkBlackboxing”来实现,但我不知道如何使用WebPack包来完成它。 最佳答案 在您的Webpack配置中使用devtool:"#eval"(或在命令行中使用--devtool#eval)似乎同时支持黑盒和适当的堆栈痕迹。

javascript - 用于在 node_modules 中编译模块的 Webpack 配置

我的webpack/babel配置有问题。我已经将我的组件存储库(里面没有webpack配置的es6模块)安装为node_module。在这种情况下它不起作用-我收到“意外的token导入”错误(babel不转换es6代码)但是,如果我将外部文件夹链接到node_modules(npm链接./../../component-repository),那么它可以正常工作,没有任何错误。我花了很多时间,仍然无法解决这个问题。主要问题是如何在各个项目之间共享React组件。我的想法是将它们添加为依赖项。编辑:如何为项目设置webpack&babel以从node_modules文件夹编译ES6模

javascript - 将 JavaScript 与 Webpack 捆绑在一起时,require/import URL 开头的 @ 符号是什么意思?

我正在使用Webpack来捆绑我的JavaScript应用程序。我在一次谈话中看到一位开发人员有类似这样的台词:varfoo=require('@/foo/bar');或import'@/foo/bar';在这种情况下,@符号是什么意思?同事认为这可能是node_modules的捷径,这类问题由于含糊不清,很难得到好的搜索结果。 最佳答案 @字符在Webpack中没有特殊含义,除非您对其进行配置。我想,这是一个privatenpmmodule. 关于javascript-将JavaScr

javascript - 如何在 webpack 中使用 angular ui-router?

我只是发布相关的代码,希望能帮助我解释情况。我设置了webpack,所有的Controller和指令都是分开工作的。但是,我不明白如何将angularui-router与webpack一起使用。我不明白如何将image-list.html链接到$stateProvider中的templateurl。我已经在app.js文件中导入模板,所以我不知道为什么模板没有显示在localhost中。每个模板的Controller都在它们的.js文件中定义。告诉ui-router首先打开image-list.html的正确方法是什么,一旦我这样做了,我如何在同一页面中从image-list.html

javascript - webpack 需要的动态文件路径?

当我使用require手动请求文件时,这工作正常,但是当我使用完全相同的请求时,更改字符串以便它与变量分开时失败。效果很好:module.exports=(function(){var$svg=require('svg-inline!../../assets/svgs/global/connected.svg');console.log($svg);}());但是如果我要这样做:module.exports=(function(){var$path='../../assets/svgs/global/';var$svg=require('svg-inline!'+$path+'conn