webpack 3.x 环境搭建

最新推荐文章于 2023-01-01 15:54:05 发布
置顶 最新推荐文章于 2023-01-01 15:54:05 发布
阅读量1k 收藏 2
点赞数 2
分类专栏： 前端 文章标签： webpack vue 前端 webpack3.x webpack3.0
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38593865/article/details/90244913
版权

概念（是什么？）

本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。（摘抄来自webpack中文网）

能做什么？

1. webpack能够处理JS之间的依赖关系

2. webpack能够处理JS的兼容问题；把高级的浏览器不识别的如法（eg：ES6），转为“低级的” 浏览器能够识别的语法；

怎么做？

案例

    1. 首先你的环境需要安装node.js

PS D:\webpack-study\csdnweb> node -v
v8.11.3
PS D:\webpack-study\csdnweb>

2. 新建一个文件夹，用vscode打开，终端中运行 npm init -y 命令初始化项目；运行命令之后，在项目根目录中会生成一个package.json文件；

PS D:\webpack-study\csdnweb> npm init -y
Wrote to D:\webpack-study\csdnweb\package.json:

{
  "name": "csdnweb",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}


PS D:\webpack-study\csdnweb>

3. 下载webpack ; 运行命令 npm i webpack@3.6.0 --save-dev (选择稳定版本3.6.0)

PS D:\webpack-study\csdnweb> npm i webpack@3.6.0 --save-dev

> uglifyjs-webpack-plugin@0.4.6 postinstall D:\webpack-study\csdnweb\node_modules\uglifyjs-webpack-plugin
> node lib/post_install.js

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN csdnweb@1.0.0 No description
npm WARN csdnweb@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ webpack@3.6.0
added 331 packages in 20.473s
PS D:\webpack-study\csdnweb>

4. 运行命令：npm i babel babel-core babel-loader babel-preset-es2015 babel-preset-stage-0 --save-dev

PS D:\webpack-study\csdnweb> npm i babel babel-core babel-loader babel-preset-es2015 babel-preset-stage-0 --save-dev
npm WARN deprecated babel-preset-es2015@6.24.1: ????  Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!
npm WARN deprecated babel@6.23.0: In 6.x, the babel package has been deprecated in favor of babel-cli. Check https://opencollective.com/babel to support the Babel maintainersnpm WARN babel-loader@8.0.6 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN csdnweb@1.0.0 No description
npm WARN csdnweb@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ babel-preset-stage-0@6.24.1
+ babel-preset-es2015@6.24.1
+ babel-loader@8.0.6
+ babel-core@6.26.3
+ babel@6.23.0
added 124 packages in 9.917s
PS D:\webpack-study\csdnweb>

5. 在项目根目录下建一个名称为“.babelrc”的文件，文件内容为

{"presets":["es2015","stage-0"]}

6. 为了让webpack打包时识别css，运行一下命令：npm i css-loader style-loader less less-loader --save-dev

PS D:\webpack-study\csdnweb> npm i css-loader style-loader less less-loader --save-dev
npm WARN babel-loader@8.0.6 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN css-loader@2.1.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN csdnweb@1.0.0 No description
npm WARN csdnweb@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
+ css-loader@2.1.1+ less-loader@5.0.0
+ less@3.9.0
+ style-loader@0.23.1
added 82 packages in 10.052s
PS D:\webpack-study\csdnweb>

7. 为了识别文件和路径，运行一下命令：npm i url-loader file-loader --save-dev

PS D:\webpack-study\csdnweb> npm i url-loader file-loader --save-dev
npm WARN babel-loader@8.0.6 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN css-loader@2.1.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN file-loader@3.0.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN csdnweb@1.0.0 No description
npm WARN csdnweb@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})+ file-loader@3.0.1
+ url-loader@1.1.2
added 3 packages in 34.887s
PS D:\webpack-study\csdnweb>
PS D:\webpack-study\csdnweb>

8. 安装插件，运行命令：npm i html-webpack-plugin --save-dev

PS D:\webpack-study\csdnweb> npm i html-webpack-plugin --save-dev
npm WARN babel-loader@8.0.6 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN css-loader@2.1.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN file-loader@3.0.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN csdnweb@1.0.0 No description
npm WARN csdnweb@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})+ html-webpack-plugin@3.2.0
added 47 packages in 7.313s
PS D:\webpack-study\csdnweb>

9. 根目录新建src，src下有文件夹js，css，images；以及文件index.html, main.js；

a > js/AAA.js

/* jshint esversion: 6 */
export let str = "good good study, day day up";

b > css/style.css

html,body{
    margin: 0;
    padding: 0;
    background-color: gainsboro;
    width: 100%;
    height: 100%;
}

c > css/style1.less

body{
    #aaa{
        color: red;
    }
}

d > images文件夹中放入一张图片名称为1.jpg

e > src/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div id="aaa"></div>
</body>
</html>

f > src/main.js

/* jshint esversion: 6 */
import {str} from "./js/AAA.js";
import "./css/style1.less";
import "./css/style.css";
import imgSrc from "./images/1.jpg";
let img = new Image();
img.src=imgSrc;
img.onload=function(){
    document.body.appendChild(img);
};
let aaa = document.getElementById("aaa");
aaa.innerHTML = str;
console.log(str);

10. 根目录下创建 webpack.config.js

/* jshint esversion: 6 */

// html-webpack-plugin 作用
 /*1. 自动在内存中根据指定页面生成一个内存的页面
   2. 自动把打包好的（index.html中引用的）js追加到页面中去*/
   let HtmlWebpackPlugin=require("html-webpack-plugin");
   var path = require('path');
   module.exports = {
       entry:"./src/main.js",
       output:{
           filename:'build.js',
           path: path.resolve(__dirname, './dist')
       },
       module:{ // 这个节点用于配置加载第三方模块的加载器
           rules:[ // 所有第三方的规则
               {test:/\.js$/,use:["babel-loader"],exclude:/node_modules/},
               {test:/\.css$/,use:["style-loader","css-loader"]},
               {test:/\.less$/,use:["style-loader","css-loader","less-loader"]},
               {test:/\.(jpg|gif|png|jpeg)$/i,use:["url-loader?limit=5120"]}
           ]
       },
       plugins:[ // 创建一个在内存中生成html 页面的插件
           new HtmlWebpackPlugin({template:"./src/index.html"})
       ]
   }

11. 修改生成的package.json，把scripts属性修改如下

{
  "name": "csdnweb",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.6",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "css-loader": "^2.1.1",
    "file-loader": "^3.0.1",
    "html-webpack-plugin": "^3.2.0",
    "less": "^3.9.0",
    "less-loader": "^5.0.0",
    "style-loader": "^0.23.1",
    "url-loader": "^1.1.2",
    "webpack": "^3.6.0"
  }
}

12. 运行命令npm run build 发现报错

PS D:\webpack-study\csdnweb> npm run build

> csdnweb@1.0.0 build D:\webpack-study\csdnweb
> webpack

Hash: 953519a8b456c6d39f1e
Version: webpack 3.6.0
Time: 559ms
     Asset       Size  Chunks             Chunk Names
  build.js    5.01 kB       0  [emitted]  main
index.html  349 bytes          [emitted]
   [0] ./src/main.js 2.54 kB {0} [not cacheable] [built] [failed] [1 error]

ERROR in ./src/main.js
Module build failed: Error: Cannot find module '@babel/core'
 babel-loader@8 requires Babel 7.x (the package '@babel/core'). If you'd like to use Babel 6.x ('babel-core'), you should install 'babel-loader@7'.
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (D:\webpack-study\csdnweb\node_modules\babel-loader\lib\index.js:10:11)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at loadLoader (D:\webpack-study\csdnweb\node_modules\loader-runner\lib\loadLoader.js:18:17)
    at iteratePitchingLoaders (D:\webpack-study\csdnweb\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
    at runLoaders (D:\webpack-study\csdnweb\node_modules\loader-runner\lib\LoaderRunner.js:365:2)
    at NormalModule.doBuild (D:\webpack-study\csdnweb\node_modules\webpack\lib\NormalModule.js:182:3)
    at NormalModule.build (D:\webpack-study\csdnweb\node_modules\webpack\lib\NormalModule.js:275:15)
    at Compilation.buildModule (D:\webpack-study\csdnweb\node_modules\webpack\lib\Compilation.js:149:10)
    at moduleFactory.create (D:\webpack-study\csdnweb\node_modules\webpack\lib\Compilation.js:447:10)
    at factory (D:\webpack-study\csdnweb\node_modules\webpack\lib\NormalModuleFactory.js:241:5)
    at applyPluginsAsyncWaterfall (D:\webpack-study\csdnweb\node_modules\webpack\lib\NormalModuleFactory.js:94:13)
    at D:\webpack-study\csdnweb\node_modules\tapable\lib\Tapable.js:268:11
    at NormalModuleFactory.params.normalModuleFactory.plugin (D:\webpack-study\csdnweb\node_modules\webpack\lib\CompatibilityPlugin.js:52:5)
    at NormalModuleFactory.applyPluginsAsyncWaterfall (D:\webpack-study\csdnweb\node_modules\tapable\lib\Tapable.js:272:13)
    at resolver (D:\webpack-study\csdnweb\node_modules\webpack\lib\NormalModuleFactory.js:69:10)
    at process.nextTick (D:\webpack-study\csdnweb\node_modules\webpack\lib\NormalModuleFactory.js:194:7)
    at _combinedTickCallback (internal/process/next_tick.js:131:7)
    at process._tickCallback (internal/process/next_tick.js:180:9)
Child html-webpack-plugin for "index.html":
     1 asset
       [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 510 bytes {0} [built]
       [2] (webpack)/buildin/global.js 509 bytes {0} [built]
       [3] (webpack)/buildin/module.js 517 bytes {0} [built]
        + 1 hidden module
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! csdnweb@1.0.0 build: `webpack`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the csdnweb@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Administrator\AppData\Roaming\npm-cache\_logs\2019-05-15T13_35_03_583Z-debug.log
PS D:\webpack-study\csdnweb>

13. 根据提示运行命令 npm i babel-loader@7

PS D:\webpack-study\csdnweb> npm i babel-loader@7
npm WARN css-loader@2.1.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN file-loader@3.0.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN csdnweb@1.0.0 No description
npm WARN csdnweb@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ babel-loader@7.1.5
removed 6 packages and updated 5 packages in 6.895s
PS D:\webpack-study\csdnweb>

13. 再次运行命令npm run build

PS D:\webpack-study\csdnweb> npm run build

> csdnweb@1.0.0 build D:\webpack-study\csdnweb
> webpack

Hash: edbfe9c65ba5664ca8b9
Version: webpack 3.6.0Time: 1871ms
                               Asset       Size  Chunks             Chunk Names
1d9708d6a778bd9a21fae174f82156f6.jpg    9.32 kB          [emitted]
                            build.js      23 kB       0  [emitted]  main
                          index.html  349 bytes          [emitted]
   [2] ./src/main.js 339 bytes {0} [built]
   [3] ./src/js/AAA.js 73 bytes {0} [built]
   [4] ./src/css/style1.less 1.23 kB {0} [built]
   [5] ./node_modules/css-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js!./src/css/style1.less 173 bytes {0} [built]
   [7] ./src/css/style.css 1.09 kB {0} [built]
   [8] ./node_modules/css-loader/dist/cjs.js!./src/css/style.css 271 bytes {0} [built]
   [9] ./src/images/1.jpg 82 bytes {0} [built]
    + 3 hidden modules
Child html-webpack-plugin for "index.html":
     1 asset
       [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 510 bytes {0} [built]
       [2] (webpack)/buildin/global.js 509 bytes {0} [built]
       [3] (webpack)/buildin/module.js 517 bytes {0} [built]
        + 1 hidden module
PS D:\webpack-study\csdnweb>

14. 在根目录生成的dist文件夹中，有个index.html；访问结果如下

这样我们webpack的环境就搭建好了；在刚开始学习的时候，会碰到各种版本的问题，令人很苦恼；在之后学习了vue-cli之后，那个时候会非常容易；

但是现在还是有一个问题；进行到14步的时候，我们实现了用wabpack打包；但是我们在开发环境中，是不需要打包的，只需要在代码开发完成之后，才会选择打包；而且在实际的开发中，总是修改了一行代码就需要看效果；这种方式岂不是很麻烦？那就接着看吧；

 

15. 安装 webpack-dev-server ；运行命令：npm i webpack-dev-server@2.11.1 --save-dev

PS D:\webpack-study\csdnweb> npm i webpack-dev-server@2.11.1 --save-dev
npm WARN css-loader@2.1.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN file-loader@3.0.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN csdnweb@1.0.0 No description
npm WARN csdnweb@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ webpack-dev-server@2.11.1
added 194 packages in 15.219s
PS D:\webpack-study\csdnweb>

16. 修改package.json

"scripts": {
    "build": "webpack",
    "dev":"webpack-dev-server --open --port 8899" // 添加新内容
 }

命令 "webpack-dev-server --open --port 8899" 中，加上指令 "--open" 是在运行 "npm run dev" 时，自动打开网页；"--port 8899" 是为服务指定启动端口号；还有一个"-hot" 热加载的指令；

17. 运行npm run dev ,你就会看到和上面一样的网页；


 

lu5211019
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
npm install 报错(npm ERR! errno 1)
09-15 5135
最好看错误提示，若缺少包文件，就依次安装 问题一 npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! uglifyjs-webpack[email protected] postinstall: `node lib/post_install.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at t...
vue项目开发问题解决1
SKYG909040638的博客
09-03 1023
TBTX@DESKTOP-UTAMQUV MINGW64 /e/web/taotian/vue/TX_TSM_FE/tgz-tsm-vue (develop-wcf) $ npm install uglifyjs-webpack[email protected] postinstall E:\web\taotian\vue\TX_TSM_FE\tgz-tsm-vue\node_modules\ugli...
webpack入门介绍（webpack 3.X）
Vv_mkziyuan
01-01 894
webpack是为什么？ 为什么要使用webpack？ 怎么配置webpack？
webpack 3.X 安装与配置
Stan的专栏
11-23 8571
组件如何接收属性，所有的属性都可以通过this.props对象获取，像下面这样去使用：<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Hello World</title> <script crossorigin src="https://unpkg.com/react@16/umd/react.
12-安装node.js和webpack的完整步骤
书启鸿蒙知秋枫
10-01 2445
【代码】安装webpack的完整步骤。
Webpack3.X版本使用指南(一)
@不喝海之言@
03-08 546
Webpack使用指南(一) 序言： ​ 说起来是个序，倒不如说是对这篇文章名字由来的介绍。 ​ 本来我也想这把这篇博客的名字写成《Webpack配置教程》，但是想了一下，webpack有什么好配置的吗？或许真的有，但是说一下配置又如何呢？好像作用也不是那么的大。 ​ 所以我不准备说webpack怎么去配置，我只想这结合着案例，简单说一下webpack怎么去用，争取让你能找到一点使用webpac...
知乎日报npm install装环境不能继续，尚不明原因
weixin_40945354的博客
02-20 1912
ivyone@ivyonedeMacBook-Pro daily % npm install npm WARN deprecated extract-text-webpack[email protected]: Deprecated. Please use https://github.com/webpack-contrib/mini-css-extract-plugin npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+.
hand-vue3-project:Vue 3.x + Webpack 5.x 手动搭建开发环境
05-26
Vue 3.x + Webpack 5.x 手动搭建 Vue 开发环境
详解webpack4.x之搭建前端开发环境
10-17
主要介绍了详解webpack4.x之搭建前端开发环境，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Webpack 4.x搭建react开发环境的方法步骤
10-18
主要介绍了Webpack 4.x搭建react开发环境的方法步骤，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
WebStorm增加对babel的支持
pansanday的专栏
03-05 953
命令行安装babel：# npm install -g babel# npm install -g babel npm WARN deprecated [email protected]3.0: In 6.x, the babel package has been deprecated in favor of babel-cli. Check https://opencollective.com/babel to...
运行webpack命令每次提示安装webpack-cli
datouniao1的博客
07-19 1357
再react创建的脚手架张运行webpack 提示需要安装webpack-cli webpack-cli 是用来在控制台运行webpack命令的工具 可是我记得之前安装过webpack-cli，为什么还要安装 原因是我没有全局安装webpack-cli: 我只是按照提示：npm install -D webpack-cli 执行了这个命令，但是这个是在项目上面安装 npm install -D 等价于：npm install --save-dev npm install moduleN.
从零开始学VUE之Webpack(JS打包压缩插件的使用)
彼岸舞的博客
06-07 432
JS打包压缩插件 在项目发布之前,我们必然需要对js等文件进行压缩处理 这里我们就对打包的JS进行压缩 我们使用 一个第三方插件uglifyjs-webpack-plugin,并且版本号指定1.1.1.,和cli2保持一致 npm install uglifyjs-webpack[email protected] --save-dev 执行命名安装插件 D:\zhan...
Error in TypeError: Cannot read property '0' of undefined
bahuang2212的博客
03-06 362
从github搞下来一个简单的项目，想看看来着，但是运行 npm start 也就是 react-scripts start 的时候发生异常 大体错误如下： - ExternalModuleFactoryPlugin.js:19 [web]/[webpack]/lib/ExternalModuleFactoryPlugin.js:19:40 - Normal...
webpack指定版本下载安装和卸载
詹大先生的博客
05-10 3204
注意：webpack和webpack-dev-server有版本兼容性的要求 webpack 3.x 要使用 webpack-dev-server 2.x webpack 4.x 要使用 webpack-dev-server 3.x webpack版本查看 webpack -v 全局安装指定版本的webpack（局部安装去掉-g） npm install webpack@4.46.0 -g 全局安装指定版本的webpack-dev-server（局部安装去掉-g） ..
vue启动的时候报错了requires a peer of webpack@^4.0.0 but none is installed.
热门推荐
lambertwe的博客
10-13 2万+
npm install npm WARN [email protected] requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself. audited 14682 packages in 8.843s found 3 moderate seve...
centOS 安装 yapi
Know Destiny的博客
09-07 271
# 清除yum命令缓存 sudo yum clean all #yum卸载低版本nodejs yum remove nodejs npm -y # 获取资源，安装高版本nodejs curl -sL https://rpm.nodesource.com/setup_8.x | bash - sudo yum install -y nodejs #查看git版本 git --version #安装,如果没有请安装 yum install -y git 配置安
webpack v.3.x 入门（一） — 安装
starleejay的博客
09-28 1109
webpack v.3.x 入门（一） — 安装环境要求webpack 依赖于 node.js 环境，在使用 webpack 之前，下载安装 node.js 。安装 webpack 全局安装 全局安装后可以供命令行在全局环境下，直接运行 webpack 命令。在全局安装时，将会使项目中的 webpack 锁定到指定的版本，在使用不同版本的项目中，可能会导致构建失败。 npm install w
webpack2.x升级到webpack5.x
最新发布
05-18
3. 更新loader：webpack5.x已经默认支持ES6模块，因此需要将babel-loader的版本升级到8.x以上版本。 4. 处理模块依赖：webpack5.x默认使用“module type”为ES modules，如果你使用的是CommonJS模块，请更新配置...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值