无法解决 webpackcli invalid regular expression 错误
can't solve webpackcli invalid regular expression error
对于我的应用程序，当我尝试从我的 package.json 运行 buildDev 脚本时，我收到错误：
[webpack-cli] SyntaxError: Invalid regular expression: /(\p{Uppercase_Letter}+|\p{Lowercase_Letter}|\d)(\p{Uppercase_Letter}+)/: Invalid escape
at pathToArgumentName (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:67:4)
at addFlag (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:207:16)
at traverse (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:284:21)
at traverse (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:340:23)
at traverse (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:289:24)
at Object.getArguments (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:349:2)
at WebpackCLI.getBuiltInOptions (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack-cli\lib\webpack-cli.js:892:41)
at makeCommand (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack-cli\lib\webpack-cli.js:1053:22)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:182:7)
buildDev 脚本是：
"buildDev": "npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME% ",
让我感到困惑的是，如果我去我的终端并执行以下操作：
npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME%
它工作得非常好，没有任何错误，但是执行 npm 运行 buildDev 让我遇到了那个错误。
可能是什么原因造成的？我不确定这是否与它有关，但我正在使用：
网络包：5.70.0
webpack-cli: 4.9.2
编辑：
我不确定这是否与它有关，但这是我的 webpack.config.js:
const path = require('path');
const webpack = require('webpack');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
module.exports = {
mode: 'development',
context: __dirname,
output: {
path: __dirname,
filename: '[name].bundle.js'
},
devtool: 'eval-cheap-module-source-map',
entry: {
'Content/CSS/bundles/common': './Content/CSS/commonCss.js',
'Scripts/bundles/common': ['babel-polyfill', './Scripts/common.js'],
'Scripts/bundles/gdpr_dm': ['babel-polyfill', './Areas/Gdpr/DataMappingApp/main.jsx'],
'Scripts/bundles/gdpr_dma': ['babel-polyfill', './Areas/Gdpr/GdprListAdminApp/main.jsx'],
'Scripts/bundles/gdpr_sar': ['babel-polyfill', './Areas/Gdpr/SarApp/main.jsx'],
'Scripts/bundles/support_columns': ['babel-polyfill', './Areas/Support/GridColumnsAdminApp/main.jsx'],
'Scripts/bundles/vendor': [
'react', 'react-router', 'react-dom',
'react-router-dom', 'redux', 'react-redux',
'@progress/kendo-ui/js/kendo.core', '@progress/kendo-dropdowns-react-wrapper',
'@progress/kendo-grid-react-wrapper', '@progress/kendo-ui/js/kendo.grid.js',
'@progress/kendo-ui/js/kendo.tooltip', '@progress/kendo-ui/js/kendo.multiselect'
],
'Scripts/bundles/admin_area': ['babel-polyfill', './Areas/Admin/scripts/admin_area.js']
},
module: {
rules: [
{
test: /\.jsx?$/,
include: [
path.join(__dirname, '/Areas/Gdpr/DataMappingApp/'),
path.join(__dirname, '/Areas/Gdpr/GdprListAdminApp/'),
path.join(__dirname, '/Areas/Gdpr/SarApp/'),
path.join(__dirname, '/Areas/Support/GridColumnsAdminApp/'),
path.join(__dirname, '/common_scripts/')
],
use: [{
loader: 'babel-loader',
}]
},
{
test: /\.css$/i,
use: [MiniCssExtractPlugin.loader, "css-loader"],
},
{
test: /\.(png|jpe?g|gif)$/,
use: [{ loader: 'url-loader',
options: {
limit: 4096,
name: '[name].[ext]&useRelativePath=true&publicPath=../'
}
}]
}
]
},
plugins: [
new MiniCssExtractPlugin(),
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
}),
new webpack.ProvidePlugin({
__assign: ['tslib', '__assign'],
__extends: ['tslib', '__extends'],
}),
],
resolve: {
extensions: ['.js', '.jsx'/*, ".tsx", ".ts"*/],
fallback: {
"fs": false,
"crypto": require.resolve("crypto-browserify"),
"https": require.resolve("https-browserify"),
"stream": require.resolve("stream-browserify"),
"path": require.resolve("path-browserify"),
"http": require.resolve("stream-http"),
},
alias: {
common_scripts: path.resolve(__dirname, 'common_scripts'),
process: "process/browser"
}
},
};
和我的 package.json:
{
"main": "index.js",
"scripts": {
"compile": "babel --presets es2015 -d /tests common_scripts/",
"test": "npm run compile && mocha --require babel-core/register jsdom-global/register common_scripts/**/*tests.js Areas/Gdpr/DataMappingApp/**/*tests.js Areas/Gdpr/GdprListAdminApp/**/*tests.js Areas/Gdpr/scripts/*.tests.js Areas/Support/GridColumnsAdminApp/**/*tests.js --reporter spec",
"buildDev": "npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME% ",
"buildDevB": "npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME% && echo \u0007 ",
"buildProd": "npm run unsetReadOnly",
"lint": "eslint Areas/Gdpr/DataMappingApp/** Areas/Gdpr/GdprListAdminApp/** Areas/Support/GridColumnsAdminApp/** Areas/Gdpr/SarApp/** common_scripts/**",
"unsetReadOnly": "attrib -R Content\kendo\2017.1.223\Bootstrap\*.png /S",
"bell": "echo \u0007",
"preinstall": "npx npm-force-resolutions"
},
"author": "BusinessPort",
"license": "ISC",
"resolutions": {
"js-yaml": "^3.11.3",
"is-svg": "^4.2.2"
},
"devDependencies": {
"@babel/core": "^7.17.8",
"@babel/plugin-proposal-object-rest-spread": "7.17.3",
"@babel/preset-env": "^7.16.11",
"@babel/preset-react": "^7.16.7",
"babel-cli": "^6.18.0",
"babel-eslint": "^8.2.3",
"babel-loader": "^8.2.4",
"babel-plugin-es6-promise": "^1.1.1",
"babel-plugin-module-resolver": "^3.1.1",
"babel-plugin-transform-object-assign": "^6.22.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"chai": "^4.1.2",
"css-loader": "^6.7.1",
"eslint": "^8.12.0",
"eslint-import-resolver-babel-module": "^4.0.0",
"eslint-import-resolver-webpack": "^0.9.0",
"eslint-plugin-import": "^2.11.0",
"eslint-plugin-react": "^7.7.0",
"file-loader": "^6.2.0",
"jsdom": "^11.10.0",
"jsdom-global": "^3.0.2",
"mini-css-extract-plugin": "2.4.0",
"mocha": "^9.2.2",
"node": "^9.8.0",
"script-loader": "^0.7.2",
"source-map-support": "0.4.3",
"style-loader": "^0.20.3",
"ts-loader": "^3.5.0",
"typescript": "^2.6.2",
"url-loader": "^4.1.1",
"webpack": "^5.70.0",
"webpack-cli": "^4.9.2"
},
"dependencies": {
"@popperjs/core": "^2.11.4",
"@progress/kendo-data-query": "^1.2.2",
"@progress/kendo-dateinputs-react-wrapper": "^2018.2.620",
"@progress/kendo-dropdowns-react-wrapper": "^2018.1.221",
"@progress/kendo-grid-react-wrapper": "^2018.1.221",
"@progress/kendo-react-dropdowns": "^0.5.1",
"@progress/kendo-theme-bootstrap": "^5.2.0",
"@progress/kendo-theme-default": "^2.50.0",
"@progress/kendo-ui": "^2018.1.411",
"@progress/kendo-validator-react-wrapper": "^2018.1.221",
"@progress/kendo-window-react-wrapper": "^2018.1.221",
"acorn": "^8.7.0",
"babel-polyfill": "^6.26.0",
"bootstrap": "^5.1.3",
"braces": "^3.0.2",
"es6-promise": "^4.2.4",
"glob-parent": "^6.0.2",
"is-extglob": "^2.1.1",
"jquery": "3.6.0",
"prop-types": "^15.6.1",
"react": "^16.3.1",
"react-dom": "^16.3.1",
"react-redux": "^5.0.7",
"react-router": "^4.2.0",
"react-router-dom": "^4.2.2",
"react-router-redux": "^4.0.8",
"redux": "^4.1.2",
"redux-thunk": "^2.4.1",
"webpack-dev-server": "^4.7.4"
}
}
终于弄明白了，问题是由于：
"node": "^9.8.0",
在 package.json 的 devDependencies 中。删除它解决了这个问题，我现在可以 运行 npm 运行 BuildDev 没有问题
对于我的应用程序，当我尝试从我的 package.json 运行 buildDev 脚本时，我收到错误：
[webpack-cli] SyntaxError: Invalid regular expression: /(\p{Uppercase_Letter}+|\p{Lowercase_Letter}|\d)(\p{Uppercase_Letter}+)/: Invalid escape
at pathToArgumentName (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:67:4)
at addFlag (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:207:16)
at traverse (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:284:21)
at traverse (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:340:23)
at traverse (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:289:24)
at Object.getArguments (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack\lib\cli.js:349:2)
at WebpackCLI.getBuiltInOptions (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack-cli\lib\webpack-cli.js:892:41)
at makeCommand (c:\tfs\Agility\Branches\AgilityMakeover\Client\Web\AgilityItemViewer\node_modules\webpack-cli\lib\webpack-cli.js:1053:22)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:182:7)
buildDev 脚本是：
"buildDev": "npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME% ",
让我感到困惑的是，如果我去我的终端并执行以下操作：
npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME%
它工作得非常好，没有任何错误，但是执行 npm 运行 buildDev 让我遇到了那个错误。
可能是什么原因造成的？我不确定这是否与它有关，但我正在使用：
网络包：5.70.0 webpack-cli: 4.9.2
编辑：
我不确定这是否与它有关，但这是我的 webpack.config.js:
const path = require('path');
const webpack = require('webpack');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
module.exports = {
mode: 'development',
context: __dirname,
output: {
path: __dirname,
filename: '[name].bundle.js'
},
devtool: 'eval-cheap-module-source-map',
entry: {
'Content/CSS/bundles/common': './Content/CSS/commonCss.js',
'Scripts/bundles/common': ['babel-polyfill', './Scripts/common.js'],
'Scripts/bundles/gdpr_dm': ['babel-polyfill', './Areas/Gdpr/DataMappingApp/main.jsx'],
'Scripts/bundles/gdpr_dma': ['babel-polyfill', './Areas/Gdpr/GdprListAdminApp/main.jsx'],
'Scripts/bundles/gdpr_sar': ['babel-polyfill', './Areas/Gdpr/SarApp/main.jsx'],
'Scripts/bundles/support_columns': ['babel-polyfill', './Areas/Support/GridColumnsAdminApp/main.jsx'],
'Scripts/bundles/vendor': [
'react', 'react-router', 'react-dom',
'react-router-dom', 'redux', 'react-redux',
'@progress/kendo-ui/js/kendo.core', '@progress/kendo-dropdowns-react-wrapper',
'@progress/kendo-grid-react-wrapper', '@progress/kendo-ui/js/kendo.grid.js',
'@progress/kendo-ui/js/kendo.tooltip', '@progress/kendo-ui/js/kendo.multiselect'
],
'Scripts/bundles/admin_area': ['babel-polyfill', './Areas/Admin/scripts/admin_area.js']
},
module: {
rules: [
{
test: /\.jsx?$/,
include: [
path.join(__dirname, '/Areas/Gdpr/DataMappingApp/'),
path.join(__dirname, '/Areas/Gdpr/GdprListAdminApp/'),
path.join(__dirname, '/Areas/Gdpr/SarApp/'),
path.join(__dirname, '/Areas/Support/GridColumnsAdminApp/'),
path.join(__dirname, '/common_scripts/')
],
use: [{
loader: 'babel-loader',
}]
},
{
test: /\.css$/i,
use: [MiniCssExtractPlugin.loader, "css-loader"],
},
{
test: /\.(png|jpe?g|gif)$/,
use: [{ loader: 'url-loader',
options: {
limit: 4096,
name: '[name].[ext]&useRelativePath=true&publicPath=../'
}
}]
}
]
},
plugins: [
new MiniCssExtractPlugin(),
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
}),
new webpack.ProvidePlugin({
__assign: ['tslib', '__assign'],
__extends: ['tslib', '__extends'],
}),
],
resolve: {
extensions: ['.js', '.jsx'/*, ".tsx", ".ts"*/],
fallback: {
"fs": false,
"crypto": require.resolve("crypto-browserify"),
"https": require.resolve("https-browserify"),
"stream": require.resolve("stream-browserify"),
"path": require.resolve("path-browserify"),
"http": require.resolve("stream-http"),
},
alias: {
common_scripts: path.resolve(__dirname, 'common_scripts'),
process: "process/browser"
}
},
};
和我的 package.json:
{
"main": "index.js",
"scripts": {
"compile": "babel --presets es2015 -d /tests common_scripts/",
"test": "npm run compile && mocha --require babel-core/register jsdom-global/register common_scripts/**/*tests.js Areas/Gdpr/DataMappingApp/**/*tests.js Areas/Gdpr/GdprListAdminApp/**/*tests.js Areas/Gdpr/scripts/*.tests.js Areas/Support/GridColumnsAdminApp/**/*tests.js --reporter spec",
"buildDev": "npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME% ",
"buildDevB": "npm run unsetReadOnly && webpack --env NODE_ENV=local && ECHO Completed at %TIME% && echo \u0007 ",
"buildProd": "npm run unsetReadOnly",
"lint": "eslint Areas/Gdpr/DataMappingApp/** Areas/Gdpr/GdprListAdminApp/** Areas/Support/GridColumnsAdminApp/** Areas/Gdpr/SarApp/** common_scripts/**",
"unsetReadOnly": "attrib -R Content\kendo\2017.1.223\Bootstrap\*.png /S",
"bell": "echo \u0007",
"preinstall": "npx npm-force-resolutions"
},
"author": "BusinessPort",
"license": "ISC",
"resolutions": {
"js-yaml": "^3.11.3",
"is-svg": "^4.2.2"
},
"devDependencies": {
"@babel/core": "^7.17.8",
"@babel/plugin-proposal-object-rest-spread": "7.17.3",
"@babel/preset-env": "^7.16.11",
"@babel/preset-react": "^7.16.7",
"babel-cli": "^6.18.0",
"babel-eslint": "^8.2.3",
"babel-loader": "^8.2.4",
"babel-plugin-es6-promise": "^1.1.1",
"babel-plugin-module-resolver": "^3.1.1",
"babel-plugin-transform-object-assign": "^6.22.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"chai": "^4.1.2",
"css-loader": "^6.7.1",
"eslint": "^8.12.0",
"eslint-import-resolver-babel-module": "^4.0.0",
"eslint-import-resolver-webpack": "^0.9.0",
"eslint-plugin-import": "^2.11.0",
"eslint-plugin-react": "^7.7.0",
"file-loader": "^6.2.0",
"jsdom": "^11.10.0",
"jsdom-global": "^3.0.2",
"mini-css-extract-plugin": "2.4.0",
"mocha": "^9.2.2",
"node": "^9.8.0",
"script-loader": "^0.7.2",
"source-map-support": "0.4.3",
"style-loader": "^0.20.3",
"ts-loader": "^3.5.0",
"typescript": "^2.6.2",
"url-loader": "^4.1.1",
"webpack": "^5.70.0",
"webpack-cli": "^4.9.2"
},
"dependencies": {
"@popperjs/core": "^2.11.4",
"@progress/kendo-data-query": "^1.2.2",
"@progress/kendo-dateinputs-react-wrapper": "^2018.2.620",
"@progress/kendo-dropdowns-react-wrapper": "^2018.1.221",
"@progress/kendo-grid-react-wrapper": "^2018.1.221",
"@progress/kendo-react-dropdowns": "^0.5.1",
"@progress/kendo-theme-bootstrap": "^5.2.0",
"@progress/kendo-theme-default": "^2.50.0",
"@progress/kendo-ui": "^2018.1.411",
"@progress/kendo-validator-react-wrapper": "^2018.1.221",
"@progress/kendo-window-react-wrapper": "^2018.1.221",
"acorn": "^8.7.0",
"babel-polyfill": "^6.26.0",
"bootstrap": "^5.1.3",
"braces": "^3.0.2",
"es6-promise": "^4.2.4",
"glob-parent": "^6.0.2",
"is-extglob": "^2.1.1",
"jquery": "3.6.0",
"prop-types": "^15.6.1",
"react": "^16.3.1",
"react-dom": "^16.3.1",
"react-redux": "^5.0.7",
"react-router": "^4.2.0",
"react-router-dom": "^4.2.2",
"react-router-redux": "^4.0.8",
"redux": "^4.1.2",
"redux-thunk": "^2.4.1",
"webpack-dev-server": "^4.7.4"
}
}
终于弄明白了，问题是由于：
"node": "^9.8.0",
在 package.json 的 devDependencies 中。删除它解决了这个问题，我现在可以 运行 npm 运行 BuildDev 没有问题