[英]Webpack 5 Receiving a Polyfill Error?!?! My JavaScript React project is receiving a polyfill error while trying to compile my webpack.config.js file
[英]Getting error when trying to run my “webpack --config ./webpack.config.js”
我正在尝试为名为Quill的开源库运行webpack配置,该库使用Webpack作为捆绑程序。 当我运行命令webpack --config ./_develop/webpack.config.js
对于配置尝试在其上执行的每个.js文件,都会收到以下错误:
ERROR in ./ui/tooltip.js
C:\Users\rinktacular\Documents\Projects\Quill\ui\tooltip.js
1:16 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
2:40 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
3:24 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
4:61 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
5:50 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
6:53 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
7:61 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
8:57 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
9:75 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
10:10 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
11:6 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
12:17 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
13:4 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
14:1 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
15:11 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
16:42 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
17:4 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
18:1 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
19:24 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
20:77 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
21:62 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
22:60 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
23:40 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
24:38 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
25:43 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
26:72 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
27:56 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
28:19 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
29:52 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
30:56 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
31:52 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
32:6 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
33:50 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
34:54 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
35:52 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
36:6 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
37:54 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
38:55 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
39:69 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
40:58 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
41:42 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
42:6 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
43:18 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
44:4 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
45:1 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
46:11 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
47:46 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
48:45 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
49:4 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
50:2 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
51:1 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
52:1 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
53:24 error Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
✖ 53 problems (53 errors, 0 warnings)
53 errors, 0 warnings potentially fixable with the `--fix` option.
@ ./quill.js 101:15-38
@ multi ./quill.js
这是配置:
var path = require('path');
var pkg = require('../package.json');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var bannerPack = new webpack.BannerPlugin({
banner:
'Quill Editor v' + pkg.version + '\n' +
'https://quilljs.com/\n' +
'Copyright (c) 2014, Jason Chen\n' +
'Copyright (c) 2013, salesforce.com',
entryOnly: true
});
var constantPack = new webpack.DefinePlugin({
QUILL_VERSION: JSON.stringify(pkg.version)
});
var source = [
'quill.js',
'core.js',
'blots',
'core',
'formats',
'modules',
'test',
'themes',
'ui'
].map(function(file) {
return path.resolve(__dirname, '..', file);
});
module.exports = function(env) {
let config = {
context: path.resolve(__dirname, '..'),
entry: {
'quill.js': ['./quill.js'],
'quill.core.js': ['./core.js'],
'quill.core': './assets/core.styl',
'quill.bubble': './assets/bubble.styl',
'quill.snow': './assets/snow.styl',
'unit.js': './test/unit.js'
},
output: {
filename: '[name]',
library: 'Quill',
libraryExport: 'default',
libraryTarget: 'umd',
path: path.resolve(__dirname, '../dist/')
},
resolve: {
alias: {
'parchment': path.resolve(__dirname, '../node_modules/parchment/src/parchment')
},
extensions: ['.js', '.styl', '.ts']
},
module: {
rules: [{
test: /\.js$/,
use: ['eslint-loader'],
include: source,
enforce: 'pre'
}, {
test: /\.ts$/,
use: [{
loader: 'ts-loader',
options: {
compilerOptions: {
declaration: false,
target: 'es5',
module: 'commonjs'
},
transpileOnly: true
}
}]
}, {
test: /\.styl$/,
include: [
path.resolve(__dirname, '../assets')
],
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
'css-loader',
'stylus-loader'
]
})
}, {
test: /\.svg$/,
include: [
path.resolve(__dirname, '../assets/icons')
],
use: [{
loader: 'html-loader',
options: {
minimize: true
}
}]
}, {
test: /\.js$/,
include: source,
use: [{
loader: 'babel-loader',
options: {
presets: ['es2015']
}
}]
}],
noParse: [
/\/node_modules\/clone\/clone\.js$/,
/\/node_modules\/eventemitter3\/index\.js$/,
/\/node_modules\/extend\/index\.js$/
]
},
plugins: [
bannerPack,
constantPack,
new ExtractTextPlugin({
filename: '[name].css',
allChunks: true
})
],
devServer: {
contentBase: path.resolve(__dirname, '../dist'),
hot: false,
port: process.env.npm_package_config_ports_webpack,
stats: 'minimal',
disableHostCheck: true
}
};
if (env && env.dev) {
config.module.rules = config.module.rules.slice(1); // Remove linter
config.module.rules[3].use[0].options = {
plugins: ['transform-es2015-modules-commonjs']
};
}
if (env && env.minimize) {
config.entry = {
'quill.min.js': './quill.js'
};
config.plugins.push(
new webpack.optimize.UglifyJsPlugin({
sourceMap: true
})
);
config.devtool = 'source-map';
}
if (env && env.coverage) {
config.module.rules[4].use[0].options = {
plugins: ['istanbul', 'transform-es2015-modules-commonjs']
};
}
return config;
};
当然,所有这些都是开源的,我并没有做出任何改变,因此这是按照他们在Local Development上的指导进行的全新安装。 因此,我真的不太确定webpack的配置如何工作,配置文件出了什么问题以及如何更改它。
您的webpack中有一条规则,告诉您使用加载程序加载js文件。 该加载器为“ eslint-loader”,该加载器用于使您的js文件工作。 这是此加载程序,它告诉您换行不正确。 有两种解决方法:
LF(\\ n)是Linux中使用的换行符,而CRLF(如果在Windows中使用换行符(\\ r \\ n))
您也可以使用“ eslint --fix”来尝试解决此问题
./node_modules/.bin/eslint --fix yourFileThatHaserrors
但是,如果您使用转换换行符的编辑器,则每次保存文件时都会发生这种情况。
总结一下:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.