关键词：
【中文标题】Webpack - TypeError：$ 不是函数【英文标题】：Webpack - TypeError: $ is not a function 【发布时间】：2020-07-06 02:43:31 【问题描述】：我是 webpack 的新手，我正在使用 webpack 创建一个反应应用程序。我在编译 TypeError: $ is not a function 时遇到此错误。
我没有使用 jquery，但我的节点模块包含一些第三方库。
我只能找到一篇与此问题相关的文章，但它与 jquery 相关。 Webpack - $ is not a function
我的 webpack 和 babel 配置有什么问题吗：
webpack.config.js
const path = require("path");
const CleanWebpackPlugin = require("clean-webpack-plugin");
const FaviconsWebpackPlugin = require("favicons-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");
const TerserPlugin = require("terser-webpack-plugin");
const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
module.exports = (env) =>
console.log("WEBPACK ENV: ", env);
const isDevMode = env !== "production";
let config =
entry: ["./src/index.js"],
output:
path: path.resolve(__dirname, "dist"),
filename: "[name].[contenthash].js"
,
resolve:
extensions: [".js", ".jsx"]
,
plugins: [
new CleanWebpackPlugin(),
new FaviconsWebpackPlugin("./src/logo.png"),
new HtmlWebpackPlugin(
template: "./src/index.html",
minify:
collapseInlineTagWhitespace: true,
collapseWhitespace: true,
removeComments: true,
removeRedundantAttributes: true
),
new MiniCssExtractPlugin(
filename: "[name].[contenthash].css"
)
],
module:
rules: [
test: /\.scss$/,
use: ["css-loader", "sass-loader"]
,
test: /\.jsx?$/,
exclude: /node_modules\/(?!(sdk1|sdk2)\/).*/,
use: ["babel-loader"]
,
test: /\.(ac3|gif|jpe?g|m4a|mp3|ogg|png|svg|otf)$/,
loader: "file-loader",
options:
outputPath: "./assets"
]
,
optimization:
minimize: true,
minimizer: [new OptimizeCssAssetsPlugin(), new TerserPlugin()],
splitChunks:
cacheGroups:
vendors:
test: /[\\/]node_modules[\\/]/,
name: "vendors",
chunks: "all"
;
// Mode
config.mode = isDevMode ? "development" : "production";
// Dev Tools
config.devtool = isDevMode ? "inline-source-map" : false;
// Plugins
if (!isDevMode)
config.plugins.push(new BundleAnalyzerPlugin( analyzerPort: 8181 ));
// Dev Server
if (isDevMode)
config.devServer = ;
config.devServer.disableHostCheck = true;
return config;
;babel.config.js
module.exports =
plugins: [
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-transform-object-assign",
[
require.resolve("babel-plugin-module-resolver"),
root: ["./src/"],
alias:
js: "./src/js",
scss: "./src/scss",
components: "./src/js/components",
containers: "./src/js/containers",
phaser_path: "./src/js/phaser",
services: "./src/js/services",
constants: "./src/js/constants"
]
],
presets: [
[
"@babel/preset-env",
useBuiltIns: "usage",
corejs: 3,
modules: false,
debug: true,
targets:
browsers: [">0.25%", "ie >= 11"]
],
[
"@babel/preset-react",
development: true
]
]
;我认为它与 html-webpack-plugin 有关，但我不确定。任何帮助表示赞赏。
谢谢
【问题讨论】：
嘿！您找到解决方法了吗？ @Emixam23 嗨，请查看我在下面发布的答案。基本上我不得不删除useBuiltIns 属性并使用其他方法来填充。我希望它对你的情况有所帮助。
【参考方案1】：
我目前正在使用它作为 polyfill 的解决方法，因为 useBuiltIns 属性不适合我。
安装了以下包：babel-polyfill、es6-promise、whatwg-fetch
npm i babel-polyfill
npm i --save-dev es6-promise whatwg-fetch
在 webpack.config.js 中做了这些改变
-
需要 es6-promise 在顶部
require("es6-promise").polyfill();
像这样将whatwg-fetch 和babel-polyfill 添加到配置中的entry 属性entry: ["whatwg-fetch", "babel-polyfill", "./src/index.js"]
【讨论】：
webpack：TypeError：validateOptions 不是函数
】webpack：TypeError：validateOptions不是函数【英文标题】：webpack:TypeError:validateOptionsisnotafunction【发布时间】：2021-07-3009:32:34【问题描述】：Webpack抛出错误，我没有做任何特殊更改。我将tailwindcss与rails6一起使用。通常application.js大... 查看详情
TypeError：webpack.ProvidePlugin 不是构造函数
】TypeError：webpack.ProvidePlugin不是构造函数【英文标题】：TypeError:webpack.ProvidePluginisnotaconstructor【发布时间】：2021-05-2309:09:58【问题描述】：我正在尝试使用简单的引导程序，jquery插件bootstrap-show-password，但在加载带有表单的页面... 查看详情
webpack - TypeError：dep.getResourceIdentifier 不是函数
】webpack-TypeError：dep.getResourceIdentifier不是函数【英文标题】：webpack-TypeError:dep.getResourceIdentifierisnotafunction【发布时间】：2018-08-1402:54:04【问题描述】：尝试使用laravel-mix2.0.0&webpack4.1.0在laravel5.6.7下混合npmrundev每次运行都会出现... 查看详情
TypeError: webpack.optimize.UglifyJsPlugin 不是构造函数
】TypeError:webpack.optimize.UglifyJsPlugin不是构造函数【英文标题】：TypeError:webpack.optimize.UglifyJsPluginisnotaconstructor【发布时间】：2021-11-2619:15:05【问题描述】：我遇到了TypeError并且不确定如何解决它。我期待着您能提供的任何帮助。以... 查看详情
webpack-cli TypeError cli.isValidationError 不是函数
】webpack-cliTypeErrorcli.isValidationError不是函数【英文标题】：webpack-cliTypeErrorcli.isValidationErrorisnotafunction【发布时间】：2021-05-2702:54:53【问题描述】：无法运行构建[webpack-cli]TypeError:cli.isValidationError不是函数在指挥部。(/Users/lokesh/Docu... 查看详情
TypeError: __webpack_require__.i(...) 不是函数
】TypeError:__webpack_require__.i(...)不是函数【英文标题】：TypeError:__webpack_require__.i(...)isnotafunction【发布时间】：2017-04-1321:42:43【问题描述】：我在尝试简化导入时遇到webpackTypeError。以下代码可以正常工作。在这里，我从core/components... 查看详情
运行“npm run webpack”我得到一个“TypeError：CleanWebpackPlugin 不是构造函数”
】运行“npmrunwebpack”我得到一个“TypeError：CleanWebpackPlugin不是构造函数”【英文标题】：Running"npmrunwebpack"Igeta"TypeError:CleanWebpackPluginisnotaconstructor"【发布时间】：2019-12-0713:36:57【问题描述】：我正在运行带有Aurelia... 查看详情
未处理的拒绝（TypeError）：moralis__WEBPACK_IMPORTED_MODULE_1__.Moralis.start 不是函数
】未处理的拒绝（TypeError）：moralis__WEBPACK_IMPORTED_MODULE_1__.Moralis.start不是函数【英文标题】：UnhandledRejection(TypeError):moralis__WEBPACK_IMPORTED_MODULE_1__.Moralis.startisnotafunction【发布时间】：2021-12-0318:03:24【问题描述】：我明白了：Unhandled 查看详情
TypeError: axios__WEBPACK_IMPORTED_MODULE_1___default.a.get(...).than 不是函数
】TypeError:axios__WEBPACK_IMPORTED_MODULE_1___default.a.get(...).than不是函数【英文标题】：TypeError:axios__WEBPACK_IMPORTED_MODULE_1___default.a.get(...).thanisnotafunction【发布时间】：2022-01-0703:24:34【问题描述】：我是reactredux的新手，我收到一个错误，... 查看详情
TypeError: (0 , _material_ui_core__WEBPACK_IMPORTED_MODULE_3__.makeStyles) 不是函数
】TypeError:(0,_material_ui_core__WEBPACK_IMPORTED_MODULE_3__.makeStyles)不是函数【英文标题】：TypeError:(0,_material_ui_core__WEBPACK_IMPORTED_MODULE_3__.makeStyles)isnotafunction【发布时间】：2021-10-1319:18:33【问题描述】：在Layout.js中编译时出现此错误我 查看详情
React TypeError: __WEBPACK_IMPORTED_MODULE_1_jquery___default(...)(...).draggable 不是函数
】ReactTypeError:__WEBPACK_IMPORTED_MODULE_1_jquery___default(...)(...).draggable不是函数【英文标题】：ReactTypeError:__WEBPACK_IMPORTED_MODULE_1_jquery___default(...)(...).draggableisnotafunction【发布时间】：2018-05-0100:26:13【问题描述】：我在我的 查看详情
Webpack，require 不是函数
...-错误如下：webpack-internal:///1495:3varcrypto=require(\'crypto\');^TypeError:requireisnotafunctionateval(webpack 查看详情
获取 TypeError：path.split 不是 Mongoose 中的函数
】获取TypeError：path.split不是Mongoose中的函数【英文标题】：GettingTypeError:path.splitisnotafunctioninMongoose【发布时间】：2021-02-0811:22:30【问题描述】：错误：node_modules\\mongoose\\lib\\schema.js:1160常量子路径=path.split(/./g);^TypeError:path.split不... 查看详情
TypeError: element.summernote 不是函数
】TypeError:element.summernote不是函数【英文标题】：TypeError:element.summernoteisnotafunction【发布时间】：2017-06-1016:58:58【问题描述】：我正在开发基于Angular、Webpack等的项目。当我想使用angular-summernote时遇到了一个非常有趣的问题它不起... 查看详情
TypeError：User.findById 不是反序列化用户的函数
】TypeError：User.findById不是反序列化用户的函数【英文标题】：TypeError:User.findByIdisnotafunctionondeserializeUser【发布时间】：2017-09-2213:06:33【问题描述】：我正在使用护照身份验证（本地和谷歌策略），现在它在“deserializeUser”函... 查看详情
webpack.validateSchema 不是函数
...2017-03-2814:45:00【问题描述】：Webpack突然抛出这个错误：TypeError:周五一切正常，今天不行。自周五以来，没有新的提交提交给master。修剪过的NPM，没有用，删除了NPM文件夹并重新安装，没有骰子。签出一个多星期没有从Master重新... 查看详情
TypeError：compiler.plugin 不是 ReactLoadablePlugin.apply 的函数
】TypeError：compiler.plugin不是ReactLoadablePlugin.apply的函数【英文标题】：TypeError:compiler.pluginisnotafunctionatReactLoadablePlugin.apply【发布时间】：2021-04-0511:31:57【问题描述】：我想使用Webpack的ReactLoadable在ReactJs中实现s-s-r。以下是package.json... 查看详情
Encore webpack 问题，因为 datepicker() 不是函数
...部件不能与Encorewebpack一起使用，因为它不是一个函数：TypeError:$(...).datepickerisnotafunctio 查看详情