Tag: webpack

在Karma中设置NODE_ENV运行webpack的正确方法是什么？: 我正在用Webpack构build我的项目，并使用Karma来运行testing。我想configurationKarma来设置process.env.NODE_ENV来“testing”Webpack来执行testing环境的项目的条件构build，URL映射到localhost，而不是生产域名。为此，我使用Webpack的env-replace-loader ，它根据process.env.NODE_ENV的值读取其configuration文件environments.json并设置variables，例如API_URL。在生产版本中，我使用Gulp来设置process.env.NODE_ENV并启动webpack。有用。我想在testing版本中设置process.env.NODE_ENV = 'test' ，通过运行karma start karma.conf.js 。目前我只是在karma.conf.js说process.env.NODE_ENV = "test" 。有没有更好的方法来做到这一点？另外，我尝试使用webpack.config.js中的webpack的webpack.config.js来设置这个variables： const webpackConfig = { … plugins: [ new webpack.DefinePlugin({ process.env: {'NODE_ENV': 'test'} }), … ], … } 它不会工作：webpack env-replace-loader诅咒Module build failed: TypeError: Cannot read property 'URL' of undefined – 我想，它不能访问它看不到的节点报告

webpack-dev-server与后端api: 我正在使用一个angularjs应用程序的webpack-dev-server，我从package.json中的一个任务开始，如下所示： "scripts": { "start-api": "node api/server.js", "dev": "webpack-dev-server –env dev –history-api-fallback –inline –progress –port 5000", "start": "npm run dev" }, 我有一个后端api服务器使用koa，并在同一个端口上运行： const koa = require('koa'); app.listen(5000); module.exports.app; 当koa服务器启动时，它拦截所有的请求，我不能浏览angular度浏览器的应用程序。我应该服从koa的一切还是有办法让这两个人一起工作？

Webpack + Express + EJS：错误：无法find模块“。”: 我正在写webpack，打字稿和ejs的快递networking应用程序。当击中应该为.ejs文件服务的路线之一时，出现以下错误： Error: Cannot find module "." at webpackMissingModule (/Users/max/Development/test/express-webpack/dist/server.js:20669:74) at new View (/Users/max/Development/test/express-webpack/dist/server.js:20669:152) at EventEmitter.render (/Users/max/Development/test/express-webpack/dist/server.js:18776:12) at ServerResponse.render (/Users/max/Development/test/express-webpack/dist/server.js:20479:7) at /Users/max/Development/test/express-webpack/dist/server.js:25508:7 at Layer.handle [as handle_request] (/Users/max/Development/test/express-webpack/dist/server.js:4524:5) at next (/Users/max/Development/test/express-webpack/dist/server.js:4743:13) at Route.dispatch (/Users/max/Development/test/express-webpack/dist/server.js:4724:3) at Layer.handle [as handle_request] (/Users/max/Development/test/express-webpack/dist/server.js:4524:5) at /Users/max/Development/test/express-webpack/dist/server.js:4054:22 代码如下：的package.json： { "name": "express-webpack", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo […]

JavaScript的ES6导入没有名称: 我正在运行Webpack，Babel和Vue.js，我想分割我的入口文件。目前我有一个app.js文件，这是我的应用程序的起点。我有一些代码我想要放入一个bootstrap.js文件，我想包括在我的主要app.js文件我可以有一个干净的文件开始与Vue和添加组件，因为我去。一些我想放在我的bootstrap.js文件中的例子： import messagesNL from './translations/nl'; Vue.use(VeeValidate, { locale: 'nl', dictionary: { nl: { messages: messagesNL } } }); window.Vue = Vue; 所以非常多的插件，全局configuration等设置。我觉得这不是你的典型模块，我发现很难创build一个像这个文件的结构模块，所以我基本上在我的app.js文件中使用这个： import bootstrap from './bootstrap'; 不知道这是否会起作用，似乎只是将所有东西都整齐地导入，而不需要像module exports {}那样进行module exports {} 。现在我分配给这个文件的bootstrapvariables在app.js是未使用的，因为它只是用来请求文件，我的IDE是'greys`类的，让我知道它是未使用的。有没有另一种语法，这样我就不必为它指定一个名字了？这种方法可以分割我的文件，还是应该做别的？我还没有把它放到一个适当的模块中，因为那样它就有了它自己的局部范围，我不能确定如何用所有的插件来设置Vue等等。如果有人有更好的build议，我可以打开它。干杯。

如何确定webpack的安装版本: 我正在用Webpack构build一些东西，用来收集和捆绑几个JS文件。不过，我想知道我正在使用哪个版本。假设我已经在全球安装了它。我怎么会没有检查package.json ？

使用Webpackcaching索引源代码中的值，使用React.js: 我正在构build一个同构的应用程序。它是完全用反应build立起来的 – 也就是说，html基础也在起作用。我有我的根html作为一个应用程序组件。它看起来像这样： … var AppTemplate = React.createClass({ displayName: 'AppTemplate', render: function() { return ( <html> <head lang="en"> <title>hello</title> <link rel="stylesheet" href='/css/style.css' /> </head> <body> <RouteHandler {…this.props}/> <script type='text/javascript' src='/js/bundle.js' /> </body> </html> ); } }); … module.exports = AppTemplate; 当我使用webpack构build项目时，我需要replacejs / bundle.js来包含哈希。 Webpack在完成后提供stats.json。但是我需要在构build期间提供散列。我正在考虑使用function标志来做这样的事情： … var AppTemplate = React.createClass({ displayName: […]

从节点传递或使用process.envvariables到reactjs: 如何从节点传递或使用process.envvariables到reactjs？例如，我有这个 const nodeEnv = process.env.NODE_ENV || 'development' 在我的发展和运作（我认为是因为它的发展，我有一个后备'development' 。但是，当我们把它推到我们的登台服务器并设置NODE_ENVvariables时，它只在第一次加载时才起作用，但随后不起作用。我想我得到这个，因为起初它是由节点服务的，它可以访问服务器variables，但事后它将反应服务页面（正确？），它将无法访问服务器的东西。那么我怎样才能得到variables来反应，而不用硬编码呢（因为我们最终会有一个不同的生产集合）？编辑。如果有差异，我们也使用webpack。

使用react-router和webpack响应改变的URL给页面找不到错误: 我有以下webpackconfiguration文件： var webpack = require('webpack'); var path = require('path'); var BUILD_DIR = path.resolve(__dirname, 'src/client/public'); var APP_DIR = path.resolve(__dirname, 'src/client/app'); var config = { entry: [ APP_DIR + '/config/routes.jsx', 'webpack/hot/dev-server', 'webpack-dev-server/client?http://localhost:8080' ], output: { publicPath: 'http://localhost:8080/src/client/public/' }, module : { loaders : [ { test: /\.jsx?$/, loader: 'babel-loader', include: APP_DIR, exclude: /node_modules/, query: { presets: ['es2015'] […]

webpack-dev-server热重新加载不起作用: 我的文件结构是： dist css style.css index.html js bundle.js src css style.css index.html js main.js node_modules webpack.config.js package.json 我的webpack.config.js看起来像： module.exports = { entry: './src/js/main.js', output: { path: __dirname, filename: './dist/js/bundle.js' }, module: { loaders: [ { test: /\.js$/, exclude: /(node_modules)/, loader: 'babel', query: { presets: ['es2015'] } }, { test: /\.vue$/, loader: 'vue' } ] } }; […]

如何更改文件后重新编译webpack？: 我使用两个入口点的webpack： entry: { js: './assets/index.js', css: './assets/sass/all.scss' }, 我想configuration它，所以当我更改js或scss文件时，它会自动再次运行webpack。我尝试使用webpack-dev-server命令使用webpack-dev-server ： webpack-dev-server –hot 它看起来像是再次build立，它输出的消息 webpack：bundle现在是有效的。但是，如果我尝试刷新浏览器，我看不到我的更改。（在开发工具上禁用高速caching并按下Ctrl + F5）。重新启动节点也不起作用，就好像它已经构build在别的地方，而不是在configuration的输出文件上： output: { path: path.join(__dirname, '/public'), filename: 'bundle.js' }，