Tag: webpack

如何在WebStorm中debuggingReact Express Webpack应用程序: 我试图debugging反应快递应用程序的后端。我正在使用webpack捆绑。如何在WebStorm上编辑configuration，以便我可以debugging前端和后端？我正在使用WebStorm 2016。

Webpack – 如何在基础HTML中要求结果文件（最佳实践）: 我刚开始使用Webpack进行SPA，我有一个问题。我如何在我的HTML中需要结果包/文件？我应该使用标签还是有更好的做法呢？

在audiosprite中加载时出错 – 找不到模块：'child_process': 我正试图加载在我的React应用程序在Webpack服务器上运行的audiosprite，我得到以下错误： Module not found：'child_process'in C：\ Users \ BenLi \ Desktop \ development projects \ app \ node_modules \ audiosprite 不知道这可能是什么，或为什么这个模块发生，显然，Webpack不应该抛出它随之而来的child_process错误。我将它包含在我的应用中，如下所示： import audiosprite from 'audiosprite'; 来自这里的错误在文件中： function spawn(name, opt) { opts.logger.debug('Spawn', { cmd: [name].concat(opt).join(' ') }) return require('child_process').spawn(name, opt) } 我该如何解决这个错误？

如何使用Webpack 2 Raw-Loader来读取文件: 我目前被困在一个地方，我需要以HTTPS模式启动NodeJS服务器，并且需要读取cert文件，以便在https.createServer(options, app).listen(8443)命令中给出这些选项。我很难理解如何将文件读入使用Webpack 2捆绑的TypeScript文件中。例如，我有2个文件file.crt和file.key。我想在创buildhttps服务器时开始读取这些文件，并开始监听给定的端口。在常规TS / JS土地上我可以这样做： “` import Config from '../env/config'; import Express from '../lib/express'; import * as https from 'https'; import * as fs from 'fs'; let config = new Config(); let app = Express.bootstrap().app; export default class AppService{ constructor(){ // console.log('blah:', fs.readFileSync('./file.txt')); } start(){ let options = { key: fs.readFileSync('file.key'), […]

Webpackconfiguration不工作，path必须是绝对的: 我的Webpackconfiguration出现错误：无效的configuration对象。 Webpack已经使用与API模式不匹配的configuration对象进行了初始化。 configuration.output.path ：提供的值"./"不是绝对path！这是我的webpack.config.js ： var config = { entry: './main.js', output: { path:'./', filename: 'index.js', }, devServer: { inline: true, port: 8080 }, module: { loaders: [ { test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel', query: { presets: ['es2015', 'react'] } } ] } } module.exports = config;

Webpack的bundle.js内容: 我开始学习webpack ， node ，并react ，我对一些基本的工作人员有点困惑。 webpack是否webpack整个react.js +我的JavaScript文件捆绑到一个输出文件中，所以当部署到生产环境时，我不需要安装项目中使用的节点包（假设它们被添加到webpack.config.js文件中）？如果以上是正确的：在我的服务器上，我只需要放置webpack（ bundle.js ）的index.html +输出？（在简单的情况下）？ package.json将只用于开发方面？

使用webpack的require.ensure函数为javascript模块编写testing: 我在我的服务器上运行摩卡testing，testing源脚本是一种单独的unit testing方式。我正在testing的一个脚本调用了Webpack的require.ensure函数，这个函数在被Webpack绑定的时候在应用程序中创build代码分割点是非常有用的。我为这个脚本编写的testing不在Webpack上下文中运行，因此require.ensure函数不存在，testing失败。我试图为这个函数创build一些polyfill / stub / mock / spy，但是没有任何运气。有一个包， webpack-require ，它允许创build一个webpack上下文。这可以工作，但速度慢得令人难以接受。我宁愿有一些直接针对require.ensure函数的轻量级require.ensure 。任何build议？ 🙂 这是一个非常基本的摩卡testing起点。摩卡testing加载一个包含方法的人工模块，如果require.ensure被定义，则返回true。 foo.js export default { requireEnsureExists: () => { return typeof require.ensure === 'function'; } }; foo.test.js import { expect } from 'chai'; describe('When requiring "foo"', () => { let foo; before(() => { foo […]

nodejs reactjs和webpack，configuration是错误的，但是什么？: 我知道有一大堆的资源描述了这个设置，我尝试了几种方法，但是它的速度正在发生变化，所以我的谷歌示例已经过时了 – 这里 package.json { "name": "scoreboard", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.3.15", "babel-loader": "^6.2.0", "babel-preset-es2015": "^6.3.13", "babel-preset-react": "^6.3.13", "babelify": "^7.2.0", "react": "^0.14.3", "react-dom": "^0.14.3", "webpack": "^1.12.9" } } 这是我的webpack.config.js module.exports = { context: __dirname […]

在NodeJS中执行webpack编译的包: 我想为我的ReactJS应用程序实现服务器端渲染。我使用react-router 。我把routes.js作为webpack入口点，并使用output.libraryTarget = "commonjs2"选项进行编译。然后我需要在NodeJS脚本中编译的结果进行渲染。但是我有错误。 Webpack在以下代码中打包模块： /* 277 */ /***/ function(module, exports, __webpack_require__) { /* WEBPACK VAR INJECTION */(function(Buffer, global) { if (global.foo) { /* … */ } /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(277).Buffer, (function() { return this; }()))) /***/ } 当NodeJS尝试执行(function() { return this; }())它的返回值undefined 。在浏览器中将返回window 。为什么webpack使用这样的包装代码？如何使这个代码在NodeJS中工作？我使用节点克隆作为外部库。 […]

如何准备我的Azure函数的代码: 我在ES6上有一些项目。以一个文件为例： export default function (a, b) { return a+b; } 我使用webpack和babel将其转换为一个带有ES2015代码的文件。得到这样的东西： /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) /******/ return installedModules[moduleId].exports; /******/ // Create a new […]