Tag: webpack

为什么用Webpack和Gulp这么大（> 1.9Mb）构build输出包？: 我通过node / npm使用webpack和webpack来构build和uglify浏览器应用程序。问题是输出app.js大约是1.9Mb。这似乎太大，并build议我可能错过了一些东西。我使用gulp build –release开始构build过程这是我的大嘴文件： import path from 'path'; import cp from 'child_process'; import gulp from 'gulp'; import gulpLoadPlugins from 'gulp-load-plugins'; import del from 'del'; import mkdirp from 'mkdirp'; import runSequence from 'run-sequence'; import webpack from 'webpack'; import minimist from 'minimist'; const $ = gulpLoadPlugins(); const argv = minimist(process.argv.slice(2)); const src […]

未捕获错误：热模块更换已禁用: 我正在使用webpack为我的版本，使用webpack-dev-server （ npm run watch ）没有任何问题，但是当我尝试创build生产版本（ npm run build ）时，我似乎在控制台中得到错误我尝试加载网站，并没有显示在屏幕上。未捕获错误：[HMR]热模块更换已禁用。我有几个关于这个问题：我对使用Hot Module Replacement理解是，它devise用于在开发过程中使生活更轻松，不应该用于生产部署。那是对的吗？鉴于下面，为什么使用Hot Module Replacement ？我不明白是什么驱动它。生产版本的最佳做法是什么？我应该为prod和dev有单独的webpackconfiguration吗？理想情况下，我想利用一个单一的configuration纯粹为了方便维护。的package.json { // … "scripts": { "build": "webpack –progress –colors –production", "watch": "webpack-dev-server –inline –hot –progress –colors" }, "dependencies": { "bootstrap": "^3.3.6", "bootstrap-sass": "^3.3.6", "bootstrap-webpack": "0.0.5", "extract-text-webpack-plugin": "^1.0.1", "html-webpack-plugin": "^2.15.0", "jquery": "^2.2.3", […]

NodeJs中的静态文件夹: 我想我的问题是基本的，但我是新的Node.js基础设施，感到非常困惑。我有一个简单的网站，我的所有js文件都被webpack绑定到bundle.js ，这个文件可以通过/static/bundle.jspath（根据webpackconfiguration）获得。但现在我有另一个静态数据文件夹在我的项目的根目录，我想要公开/static2/…地址。我怎样才能做到这一点？谁负责（webpack，nodejs等）？

使用webpack dev服务器的目的是什么？: 我试图理解为什么人们会喜欢webpack服务器的应用程序，其中webpack捆绑并提供客户端代码，并表示为api。例如。我想你可能会表示运行在一个不同的端口上运行的端口和webpack，你可以将所有的请求代理到后端express backend。不过，我仍然看到这个用法： const app = express(); const compiler = webpack(config); app.use(express.static(__dirname + '/dist')); app.use(webpackMiddleware(compiler); app.use(webpackHotMiddleware(compiler)); // And this line 明确使用这个服务器的原因是什么？

Webpack代码分裂奇怪的命名: 所以我一直在做一个小方面的项目几天，现在熟悉webpack。我已经几乎所有东西都以我想要的方式工作了，但是我对webpack拆分块的命名约定是非常奇怪的，而且我觉得我没有做一些正确的事情。目前我有我的所有Javascript导出到内容\ js [name] .bundle.js ，它工作正常，直到我开始使用确保。例如，我的主要模块被称为应用程序，所以应用程序的最终目的地是content \ js \ app.bundle.js，但是当我使用时确保它创build一个文件，如1.content \ js \ 1.bundle.js 。我想得到它输出到像content \ js \ 1.bundle.js或类似的东西。如果我至less可以放弃这个前缀，那么我会处于良好的状态，我想为我想做的事情做… 显然我无法发布图像，直到我获得更多的代表，但这里是我的输出和当前webpackconfiguration文件。我感谢帮助！ Hash: 23e616429710d37754d3 Version: webpack 1.13.1 Time: 12793ms Asset Size Chunks Chunk Names content\js\app.bundle.js 3.16 kB 0 [emitted] app 1.content\js\1.bundle.js 15.1 kB 1 [emitted] content\js\vendor.bundle.js 4.31 MB 2 [emitted] vendor content\css\app.styles.css […]

require（'jquery'）vs require（'semantic-ui-css'），只有一个在与webpack: 当编程在反应和（和我使用webpack），我注意到了 require('jquery') 在npm install jquery –save之后工作 – 保存但是 require('semantic-ui-css') 不会在npm install semantic-ui-css –save 。 webpack如何使得jquery可以像这样被导入，但是semantic-ui-css不能。换句话说，webpack如何parsing给定的模块名称加载？

如何在NODE.js服务器上使用Google字体？: 我正在开发一个使用NODE.js和REACT的应用程序。我正在尝试加载Google字体。（Open Sans）我不确定最好的方法吗？ 1）我需要安装和npm模块谷歌字体？ 2）我是否需要将其与Webpack集成？ 3）我可以使用标准标签吗？如果是这样，它应该去哪里？任何信息的最佳途径，这将是有益的。谢谢

React webapp继续在PROD环境中加载本地主机资源: 我已经部署了基于react-js的Web应用程序来制作环境，并且从浏览器控制台中，我可以看到有一些依赖代码停留在无休止的循环中，试图通过xhr从本地主机加载一些socketjs-node资源。以下是我从浏览器控制台得到的消息： abstract-xhr.js:132 Mixed Content: The page at '[MY_WEBSITE_ADDRESS]' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://localhost:3000/sockjs-node/info?t=1469401504944'. This request has been blocked; the content must be served over HTTPS.o._start @ abstract-xhr.js:132(anonymous function) @ abstract-xhr.js:21 abstract-xhr.js:132 XMLHttpRequest cannot load http://localhost:3000/sockjs-node/info?t=1469401504944. Failed to start loading.o._start @ abstract-xhr.js:132(anonymous function) @ abstract-xhr.js:21 client:70 [WDS] Disconnected!l.onclose @ […]

严重依赖关系中的警告：require函数以无法静态提取依赖关系的方式使用: 在将我的webpack升级到webpack2后，我在控制台中收到一些警告： WARNING in ./~/reflect-metadata/Reflect.js 841:28 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted 这是我的代码：的package.json： { "name": "myApp", "version": "1.0.0", "description": "myApp", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "typings": "typings", "start": "webpack-dev-server –inline –progress –port 3000" }, "author": "", "license": […]