Questions tagged «webpack»

我一直在使用webpack，在构建期间我看到了输出： + 27 hidden modules。这是什么意思？是否在不需要它们的情况下检测到我正在使用的全局常量？

83 javascript  build  webpack 

我正在将webpack用于要构建的Node框架（尽管我应该应该使用gulp）。当我包含EJS模块时，即使我明确告诉它要排除node_modules目录，Webpack也会将其包含在已编译的源代码中。 module.exports = { context: __dirname, target: 'node', // ... output: { libraryTarget: 'commonjs' // ... }, module: { loaders: [ { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?{ "stage": 0, "optional": ["runtime"] }' } ] } }; 如您所见，我对JS文件进行了测试，并告诉它排除了node_modules。为什么忽略我的排除？

83 javascript  webpack 

我正在使用webpack构建我的React组件，并且试图使用extract-text-webpack-plugin来从生成的js文件中分离出CSS。但是，当我尝试构建组件时，出现以下错误： Module build failed: ReferenceError: window is not defined。 我的webpack.config.js文件如下所示： var webpack = require('webpack'); var ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = { entry: { MainComponent: './src/main.js' }, output: { libraryTarget: 'var', library: 'MainComponent', path: './build', filename: '[name].js' }, module: { loaders: [{ test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader!css-loader') }] }, plugins: [ new …

82 reactjs  webpack 

我得到了一个基本要点，即CommonsChunkPlugin查看所有入口点，检查它们之间是否存在通用的软件包/依赖项，并将它们分成自己的捆绑包。 因此，假设我具有以下配置： ... enrty : { entry1 : 'entry1.js', //which has 'jquery' as a dependency entry2 : 'entry2.js', //which has 'jquery as a dependency vendors : [ 'jquery', 'some_jquery_plugin' //which has 'jquery' as a dependency ] }, output: { path: PATHS.build, filename: '[name].bundle.js' } ... 如果我捆绑而不使用 CommonsChunkPlugin 我将得到3个新的捆绑包文件： entry1.bundle.js包含来自entry1.js和的完整代码，jquery并包含自己的运行时 entry2.bundle.js包含来自entry2.js和的完整代码，jquery并包含自己的运行时 …

82 javascript  webpack  bundle  webpack-plugin  commonschunkplugin 

我想知道是否有一个配置选项告诉webpack只将“重要信息”记录到终端。几乎只是错误和警告，并非全部： 有这么多输出！很想压制常见的东西，只让webpack输出警告/错误。想一个解决方案webpack，webpack-dev-server以及karma-webpack。 注意：我尝试过noInfo: true，quiet: true但是似乎并没有解决问题。 编辑：我认为这可能是不可能的，所以我在github上创建了一个问题：https : //github.com/webpack/webpack/issues/1191

82 webpack  webpack-dev-server 

我正在尝试从CSS模块导入主题，但是TypeScript给我一个“找不到模块”错误，并且该主题未在运行时应用。我认为Webpack配置有问题，但是我不确定问题出在哪里。 我正在使用以下工具： "typescript": "^2.0.3" "webpack": "2.1.0-beta.25" "webpack-dev-server": "^2.1.0-beta.9" "react": "^15.4.0-rc.4" "react-toolbox": "^1.2.3" "node-sass": "^3.10.1" "style-loader": "^0.13.1" "css-loader": "^0.25.0" "sass-loader": "^4.0.2" "sass-lint": "^1.9.1" "sasslint-webpack-plugin": "^1.0.4" 这是我的 webpack.config.js var path = require('path'); var webpack = require('webpack'); var sassLintPlugin = require('sasslint-webpack-plugin'); module.exports = { entry: [ 'webpack-dev-server/client?http://localhost:8080', 'webpack/hot/dev-server', './src/index.tsx', ], output: { path: …

82 typescript  import  sass  webpack  css-modules 

导入request准系统webpack项目时，我收到三个警告消息。在GitHub上有一个重现该错误的最小示例（运行npm install和npm start）。 Critical dependency: the request of a dependency is an expression 我如何摆脱这个警告？ 更多信息： Webpack尝试require静态解析呼叫以使捆绑最小。当库在require调用中使用变量或表达式时（例如require('' + 'nodent')在的这些行中ajv），Webpack无法静态解析它们并导入整个包。 我的理由是，这种动态导入在生产中是不希望的，并且最好保持代码无警告。那意味着我想要任何解决问题的解决方案。例如： 手动配置webpack导入所需的库，并防止发生警告。 将hack.js文件添加到我的项目中，该文件以某种方式覆盖了require调用。 升级我的库。ajv-5.0.1-beta.3有一个使警告静音的修复程序。但是，如果要使用它，则必须等到它发布后再发布har-validator并request发布后续更新。如果有一种方法可以强制har-validator使用Beta版ajv，则可以解决我的问题。 其他

81 webpack  request  ajv 

我正在尝试使用webpack构建项目并对此webpack配置做出反应： var path = require('path'); var webpack = require('webpack'); module.exports = { entry: [ 'babel-polyfill', './app/less/main.less', './app/main.js', 'webpack-dev-server/client?http://localhost:8080' ], output: { publicPath: '/', filename: 'dist/main.js' }, debug: true, devtool: 'source-map', module: { loaders: [ { test: /\.js$/, include: path.join(__dirname, 'app'), loader: 'babel-loader', query: { presets: ['react', 'es2015'] } }, { …

80 reactjs  webpack  babeljs 

我将webpack路径别名用于ES6模块加载。 例如，如果我为utils而不是定义别名，则 import Foo from "../../../utils/foo"可以 import Foo from "utils/foo" 问题是，一旦我开始使用别名，WebStorm就会失去对导入的跟踪，并且会留下警告并且没有自动完成功能。 有没有一种方法可以指示WebStorm使用此类别名？

80 javascript  webstorm  webpack  es6-module-loader 

我正在尝试使用webpack-dev-server来编译文件并启动dev Web服务器。 在我中，package.json我的脚本属性设置为： "scripts": { "dev": "webpack-dev-server --hot --inline", } 因此，--hot和--inline应该启用Web服务器和热重载（据我所知）。 在我的webpack.config.js文件中，设置入口，输出和devServer设置，并添加加载程序以查找.vue文件中的更改： module.exports = { entry: './src/index.js', output: { path: __dirname + '/public', publicPath: '/public', filename: 'bundle.js' }, devtool: 'source-map', devServer:{ contentBase: __dirname + '/public' }, module:{ loaders:[ { test: /\.vue$/, loader: 'vue'} ] } }; 因此，使用此设置，我运行npm run dev。webpack-dev-server启动，模块加载程序测试成功（即，当我保存任何.vue文件时，它将导致webpack重新编译），但是： 浏览器永不刷新 …

79 javascript  webpack  vue.js  webpack-dev-server 

尤其是在从webpack v1到v2的过渡期间，以编程方式确定所安装的webpack版本非常重要，但是我似乎找不到合适的API。

79 javascript  node.js  webpack  webpack-2  webpack-3 

我正在使用webpack + babel。我有三个看起来像这样的模块： // A.js // some other imports here console.log('A'); export default 'some-const'; // B.js import someConst from './A'; console.log('B', someConst); export default 'something-else'; // main.js import someConst from './A'; import somethingElse from './B'; console.log('main', someConst); 当main.js执行时，我看到以下内容： B undefined A main some-const 如果我将中的导入交换为main.js，则B成为第一个，我得到： A B some-const main some-const 怎么会B.js得到undefined而不是第一个版本中的模块？怎么了？

78 javascript  webpack  babeljs 

通常，在开发人员模式下，Webpack使用HTTP运行。通常，有一个Web服务器在单独的端口上使用HTTP / Websockets通过HTTP和Webpack提供内容。 是否可以在https上运行Web服务器并在https / websocket secure上运行webpack？

78 ssl  https  webpack  devserver 

我正在将样式加载器与webpack和react框架一起使用。当我在终端中运行webpack时，Module not found: Error: Cannot resolve module 'style-loader'尽管我已经正确指定了文件路径，但我仍然要导入import.js文件。 import '../css/style.css'; import React from 'react'; import ReactDOM from 'react-dom'; import jQuery from 'jquery'; import TopicsList from '../components/topic-list.jsx'; import Layout from '../components/layout.jsx'; webpack.config.js： var webpack = require('webpack'); var path = require('path'); var BUILD_DIR = path.resolve(__dirname, 'build'); var APP_DIR = path.resolve(__dirname, 'build'); module.exports …

78 javascript  reactjs  webpack  webpack-style-loader 

我在这里和这里查看了文档，搜索了StackOverflow和GitHub的讨论，但仍然找不到此信息。是否有任何资源，或者谁知道Webpack中插件的顺序是否重要？以及订购工作如何进行？

78 webpack