美文网首页
React In Action · 工具链 · webpack

React In Action · 工具链 · webpack

作者: sinwaj | 来源:发表于2021-03-21 15:33 被阅读0次

一、npm start 异常

D:\CodePractice\2021\00_BoilerPlate>npm start

> 00_boilerplate@1.0.0 start D:\CodePractice\2021\00_BoilerPlate

> webpack-dev-server  --mode development --inline --hot --open

internal/modules/cjs/loader.js:589

    throw err;

    ^

Error: Cannot find module 'webpack-cli/bin/config-yargs'

    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:587:15)

    at Function.Module._load (internal/modules/cjs/loader.js:513:25)

    at Module.require (internal/modules/cjs/loader.js:643:17)

    at require (internal/modules/cjs/helpers.js:22:18)

    at Object.<anonymous> (D:\CodePractice\2021\00_BoilerPlate\node_modules\webpack-dev-server\bin\webpack-dev-server.js:65:1)

    at Module._compile (internal/modules/cjs/loader.js:707:30)

    at Object.Module._extensions..js (internal/modules/cjs/loader.js:718:10)

    at Module.load (internal/modules/cjs/loader.js:605:32)

    at tryModuleLoad (internal/modules/cjs/loader.js:544:12)

    at Function.Module._load (internal/modules/cjs/loader.js:536:3)

npm ERR! code ELIFECYCLE

npm ERR! errno 1

npm ERR! 00_boilerplate@1.0.0 start: `webpack-dev-server  --mode development --inline --hot --open`

npm ERR! Exit status 1

npm ERR!

npm ERR! Failed at the 00_boilerplate@1.0.0 start 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\sinwaj\AppData\Roaming\npm-cache\_logs\2021-03-21T07_26_42_987Z-debug.log

二、package.json版本信息

"dependencies": {

    "webpack-cli": "^4.5.0",

    "webpack-dev-server": "^3.11.2"

  }

三、降级webpack-cli

4.5.0降级到3.3.12

1.D:\CodePractice\2021\00_BoilerPlate>npm uninstall webpack-cli

2.D:\CodePractice\2021\00_BoilerPlate>npm install webpack-cli@^3.3.12

四、重新启动

D:\CodePractice\2021\00_BoilerPlate>npm start

> 00_boilerplate@1.0.0 start D:\CodePractice\2021\00_BoilerPlate

> webpack-dev-server  --mode development --inline --hot --open

i 「wds」: Project is running at http://localhost:8080/

i 「wds」: webpack output is served from /

i 「wds」: Content not from webpack is served from ./dist

i 「atl」: Using typescript@4.2.3 from typescript

i 「atl」: Using tsconfig.json from D:/CodePractice/2021/00_BoilerPlate/tsconfig.json

WARNING (@babel/preset-env): We noticed you're using the `useBuiltIns` option without declaring a core-js version. Currently, we assume version 2.x when no version is passed. Since this default version will likely change in future versions of Babel, we recommend explicitly setting the core-js version you are using via the `corejs` option.

You should also be sure that the version you pass to the `corejs` option matches the version specified in your `package.json`'s `dependencies` section. If it doesn't, you need to run one of the following commands:

  npm install --save core-js@2    npm install --save core-js@3

  yarn add core-js@2              yarn add core-js@3

More info about useBuiltIns: https://babeljs.io/docs/en/babel-preset-env#usebuiltins

More info about core-js: https://babeljs.io/docs/en/babel-preset-env#corejs

i 「wdm」: wait until bundle finished: /

i 「atl」: Checking started in a separate process...

i 「atl」: Time: 717ms

i 「wdm」: Compiled successfully.

相关文章

  • React In Action · 工具链 · webpack

    一、npm start 异常 D:\CodePractice\2021\00_BoilerPlate>npm st...

  • 简单易懂的React魔法

    本书通过实战项目来学习React, React Router, Jest, Webpack, ES6等工具。 作者...

  • 2019-04-01

    目录结构 前端工具 Git webpack Gulp 前端框架 react react-redux 某个组件的数据...

  • React技术栈

    react 构建UI的框架babel 编译器webpack 打包工具 create-react-app 脚手架re...

  • Webpack+react+es6创建项目

    Webpack 是当下最热门的前端资源模块化管理和打包工具. 使用webpack 搭建react 项目(es6) ...

  • webpack

    公司去年使用了react,做项目,需要用到webpack打包构建工具,后面自己自学了webpack,遇到了很多坑,...

  • 全家桶

    React 全家桶1.react主体2.webpack:grunt/gulp 自动化构建工具3.flex 布局4....

  • Snowpack 下使用 AntV/L7 require方法未

    在Web前端的 React 项目中使用 Snowpack 作为编译工具(Webpack 的替代工具),并在项目中引...

  • create-react-app

    脚手架工具快速构建一个React app,并支持webpack打包功能 github

  • React+webpack集成antd的配置

    React+webpack集成antd的配置 标签(空格分隔): React React+webpack集成ant...

网友评论

      本文标题:React In Action · 工具链 · webpack

      本文链接:https://www.haomeiwen.com/subject/cqancltx.html