webpack-3

问题 I'm currently working on code-splitting on CSS files on my React project. This project is built with webpack 3 , and with the help of extract-css-chunks-webpack-plugin, CSS chunks are generated nicely. However, I found that some chunks are not loaded or imported by any JS files. I've made a simplified project from my real project to demonstrate this issue. (here) In this example, when the dev-server.js is running, both app-[hash].js and app-[contentdash].css are loaded, while 0-[hash].js is

问题 I want to use: require.context('../images/', true, /\.(png|ico|svg|jpg|gif)$/) but I get the following error: Property context does not exist on type NodeRequire 回答1: Just install the typings for webpack-env npm i @types/webpack-env -D 来源： https://stackoverflow.com/questions/48935663/webpack-property-context-does-not-exist-on-type-noderequire

问题 I am currently using webpack to bundle up a javascript file with react. This file also has another import statement to another module within my project import { MyModule} from './MyModuleFile.js' Is there a way to exclude MyModule.js from the webpack bundle, and instead keep the import as is? 回答1: What you're after is the externals option in your webpack.config.js module.exports = { //... externals: { './MyModuleFile': 'MyModule', } }; 回答2: Just add it to the exclude option in your loader

问题 I am just starting to use webpack 3 and dllplugin. I managed to find a few blog articles abt. this. However none of them with a proper code sample/ GitHub samplecode. Does anyone know any references to sample code for this/ working example? 回答1: This is a good simple example: We define our functions in vendor.js (this is the library that we are going to reference as DLL). vendor.js function square(n) { return n*n; } module.exports = square; Then define WebPack configuration to export this as

问题 I'm testing out dev / prod config files using the method from the docs here https://webpack.js.org/guides/production/#simple-approach But when I switch my base config to a function I get the following error WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration should be an object. Im using webpack 3.0.0 Original webpack.config.js const path = require('path'); const webpack =

问题 so i have a few vendor files that i need to run from window scoped (it's a bunch of window scoped functions) plus i have some polyfills that i would like to bundle into the vendor bundle as well. So i tried something like this: new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', filename: 'js/vendor.min.js', minChunks: Infinity, }) entry: { 'vendor' : ['./vendor.js', './vendor2.js', './polyfills.js'] } Now when i run my webpack build it does generate my vendor bundle but it's all

问题 I managed to compile my css and less resources („imported“ from javascript) to all-my-LESS|CSS , extract them using ExtractTextPlugin and merge them together with MergeFilesPlugin to combinedStyles.css . The bit I am missing: How to run cssnano (e.g. through postcss?) on top of that as the finishing bit? (Oh, and while I habe inline source maps, I didn't manage to generate an external combinedStyles.map file). This is my combined webpack.config.babel.js (ignore the babel bit, just means, you

问题 I'm trying to migrate from webpack 3 to webpack 4. The issue I have is with CommonsChunkPlugin, when I try to run webpack ( npm run webpack-dev-server -- --config config/webpack.dev.js ), I have the following error: module.js:529 throw err; ^ Error: Cannot find module 'webpack/lib/optimize/CommonsChunkPlugin' at Function.Module._resolveFilename (module.js:527:15) at Function.Module._load (module.js:476:23) at Module.require (module.js:568:17) at require (internal/module.js:11:18) at Object.

问题 For a new project I am bound to keep things webpack-only, and thus need to find a way to efficiently compile our stylesheets. Basically in a very gulh-ish way: gather all less-files including glob-patterns like src/**/*.less (css order may be arbitrary) also allow import of css files like, say ../node_modules/vendor/**/*.css or 3rdparty/master.less (If I have to setup a bogus.js entry point for that, fine...) And with all of that, a typical gulp workflow: transpile less to css merge (concat)

问题 9 months ago I was struggling with Webpack One: [ Switching from Gulp to Webpack ] But with the recent arrival of Webpack 3, now we are willing to update our workflow. UPDATE 24.07.17 || v1 We succeed finally, it was a simple syntaxis problem: //-- webpack.config.js 'use strict'; const webpack = require('webpack'); const path = require('path'); const ExtractTextPlugin = require("extract-text-webpack-plugin"); const extractStyles = new ExtractTextPlugin('styles.bundle.css'); const