草庐IT

webpack-hmr

全部标签

javascript - 在 Webpack 中订购多个入口点

我的Webpack配置中有多个条目:entry:{'polyfills':'./src/polyfills.ts','vendor':'./src/vendor.ts','app':'./src/main.ts'},当我运行npmstart(webpack-dev-server--inline--progress--port8080--bail)\Loading...在我的index.html中按以下顺序变成脚本:但是当我运行webpack-p--progress--profile--bail它的顺序是:common,app,polyfil,thenvendor顺序很重要。如果在pol

javascript - 使用 Webpack 将 ES6 转译为单独的文件

是否可以配置webpack来做等同于:babelsrc--watch--out-dirlib这样的目录结构是这样的:-src-alpha-beta.js-charlie-delta.js-echo.js-foxtrot-golf-hotel.js将所有文件编译为ES5并在lib目录下以相同的结构输出它们:-lib-alpha-beta.js-charlie-delta.js-echo.js-foxtrot-golf-hotel.js我试过遍历所有文件路径并将它们作为单独的条目传递,但在定义输出文件时,webpack似乎“忘记”了文件的位置。Output.path只提供[hash]tok

javascript - Webpack - 为什么我的 bundle.js 文件默认缩小了?

我正在学习React,我正在学习的在线类(class)使用的是webpack。我没有在我的webpack.config中添加任何缩小或丑陋的选项,但我的bundle.js仍然被缩小了。我不确定为什么或如何将其关闭。我附上了我的webpack.config.js和package.json。谢谢你的帮助。constpath=require('path');module.exports={entry:'./src/app.js',output:{path:path.join(__dirname,'public'),filename:'bundle.js'},module:{rules:[{l

javascript - 无法使 Bootstrap 与 Webpack 一起工作

我正在使用webpack-dev-server并尝试包含Bootstrap。我有这个项目结构:──css│  └──bootstrap.min.css│──js|└──bootstrap.min.js├──dist├──index.html├──package.json├──server.js├──src│  ├──actions.js│  ├──App.js│  ├──components│  ├──constants│  ├──index.js│  └──reducers.js└──webpack.config.js这是index.html:每当我运行服务器时,我都会收到以下类型的

javascript - 如何在没有 NPM 或 Webpack 的情况下将 CDN 包含到 VueJS CLI?

我是VueJS和Webpack的新手。我已经使用VueJSCLI创建了一个项目并尝试使用它。我需要在我的代码中插入CDN。当使用标准的HTML、CSS和JS解决方案时,我会包括这样的CDN:FalseMerge如您所见,您可以使用HTML脚本标签添加CDN脚本,并在JS中开始使用它。我正在尝试对组件中的VueJS执行相同的操作。我已经准备好模板和样式部分。不幸的是,我不知道如何以简单的方式添加CDN,以便在Vue组件内的脚本标记中立即使用。我尝试这样做,但没有用。exportdefault{name:'Index',data(){return{}}}有没有办法将CDN(没有Webpac

javascript - Webpack 加载字体

我在React元素中有这段代码:require('../../Style/fonts/SomethingStrange.ttf')在我的Webpack.config中:{test:/\.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,loader:'file-loader?name=fonts/[name].[ext]'}问题:我的网页上没有字体...Webpack不是让我自动要求字体吗?我是否需要编写任何其他程序来加载字体? 最佳答案 你必须在css文件中要求你的字体,而不是在js/jsx文件

javascript - Webpack 输出为空对象

我想构建一个React组件库作为节点模块,然后将其导入到不同的项目中。但是,如果我尝试导入一个组件,它只会返回一个空对象。按钮.jsx:importReact,{Component}from'react'exportclassButtonextendsComponent{render(){returnHelloButtoncomp}}exportdefaultButton索引.jsvarButton=require('./button/button').default;module.exports={Button:Button}webpack.config.jsconstPath=re

javascript - Webpack:TypeError:无法读取未定义的属性 'properties'

这是有问题的分支和repo:https://github.com/Futuratum/moon.holdings/tree/dev/Users/leongaban/projects/Futuratum/moon.holdings/node_modules/webpack-cli/bin/config-yargs.js:89describe:optionsSchema.definitions.output.properties.path.description,不确定为什么会出现此错误,但我已从Webpack3升级到4。网页包/*eslint-disableno-console*/imp

javascript - 下划线在与 Webpack 捆绑时出错

我正在尝试重写使用require.js的旧应用程序以使用es6导入。使用的库之一是Backbone和Underscore。为了创建一个大包并将es6预编译为es5,我使用带有babel-loader的Webpack。bundle已创建,但是当我在浏览器中加载它时出现以下错误:UncaughtTypeError:Cannotreadproperty'_'ofundefined似乎Underscore中的“this”在创建的bundle.js中未定义,所以root._给我错误。//Baselinesetup//--------------//Establishtherootobject,`

javascript - Webpack 4、postcss-loader 和 autoprefixer 插件

我对让自动前缀器工作感到非常沮丧。这是我的webpack.config.jsconstHtmlWebPackPlugin=require("html-webpack-plugin");constMiniCssExtractPlugin=require("mini-css-extract-plugin");constconfig={module:{rules:[{test:/\.js$/,exclude:/node_modules/,use:{loader:"babel-loader"}},{test:/\.(scss)$/,use:[MiniCssExtractPlugin.loade