webpack 5.5.1 compiled with 1 error in 63 ms

① Create a new blank directory for the project and run the npm init –y command to initialize the package management configuration file package.json

② Create a new src source code directory

③ Create new src -> index.html homepage and src -> index.js script files

④ Initialize the basic structure of the homepage

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- index.js存在兼容性问题 -->
    <!-- <script src="./index.js"></script> -->
    <script src="../dist/main.js"></script>
</head>

<body>
    <ul>
        <li>这是第1个li</li>
        <li>这是第2个li</li>
        <li>这是第3个li</li>
        <li>这是第4个li</li>
        <li>这是第5个li</li>
        <li>这是第6个li</li>
        <li>这是第7个li</li>
        <li>这是第8个li</li>
        <li>这是第9个li</li>
    </ul>
</body>

</html>

⑤ Run npm install jquery –S command to install jQuery

⑥ Import jQuery through ES6 modularization to achieve the interlaced color change effect of the list

// 1.使用es6模块化的语法导入jquery,浏览器出现兼容性问题
import $ from 'jquery'


// 2.实现隔行变色的效果
$(function() {
    $('li:odd').css('backgroundColor', 'red')
    $('li:even').css('backgroundColor', 'cyan')
})

Install webpack

Terminal run

npm install [email protected] [email protected] -D

① In the project root directory, create a webpack configuration file named webpack.config.js and initialize the following basic configuration:

module.exports = {
    mode: 'development'
}

② Under the scripts node of package.json, add the dev script as follows:

③ Run the npm run dev command in the terminal to start webpack to package and build the project.

This happens when packaging. Webpack 5.5.1 compiled with 1 error in 63 ms prompts a small error. The reason for my problem is that there is an error in jQuery installation. It is recommended to re-run the jQuery installation command npm install jquery –S. Note that S is capital.

webpack 5.5.1 compiled with 1 error in 63 ms

Guess you like