ไม่รู้จัก webpack เป็นคำสั่งภายในหรือภายนอกโปรแกรมที่ใช้งานได้หรือไฟล์แบตช์

ฉันกำลังเรียนรู้ React.js และฉันใช้ windows 8 OS ฉันได้ไปที่โฟลเดอร์รูทของฉัน

1.Created the package.json file by npm init
2. install webpack by npm install -S webpack.now webpack has been downloaded to my modules folder
3. install webpack globally by typing npm install webpack -g
4. i am also having a webpack.config.js in my root folder which contains the source and ouput directory
5. when i type the webpack command i am getting the below error.

ไม่รู้จัก webpack เป็นคำสั่งภายในหรือภายนอกโปรแกรมที่ใช้งานได้หรือไฟล์แบตช์

ฉันมีปัญหานี้มานานแล้วด้วย (webpack ติดตั้งทั่วโลก ฯลฯ แต่ยังไม่รู้จัก) ปรากฎว่าฉันไม่ได้ระบุตัวแปรสภาพแวดล้อมสำหรับ npm (ไฟล์ webpack.cmd นั่งอยู่ที่ไหน) ดังนั้นฉันจึงเพิ่มตัวแปร Path ของฉัน

%USERPROFILE%\AppData\Roaming\npm\

หากคุณใช้ Powershell คุณสามารถพิมพ์คำสั่งต่อไปนี้เพื่อเพิ่มเส้นทางของคุณได้อย่างมีประสิทธิภาพ:

[Environment]::SetEnvironmentVariable("Path", "$env:Path;%USERPROFILE%\AppData\Roaming\npm\", "User")

สำคัญ:อย่าลืมปิดและเปิดหน้าต่างพาวเวอร์เชลล์ของคุณใหม่เพื่อใช้สิ่งนี้

หวังว่าจะช่วยได้

ทางออกที่ดีกว่าสำหรับปัญหานี้คือการติดตั้งWebpackทั่วโลก

สิ่งนี้ใช้ได้ผลเสมอและได้ผลสำหรับฉัน ลองคำสั่งด้านล่าง

npm install -g webpack

อีกทางเลือกหนึ่งหากคุณติดตั้ง Webpack ไว้ในเครื่องคุณสามารถระบุตำแหน่งที่พร้อมรับคำสั่งอย่างชัดเจนได้ดังนี้:

node_modules\.bin\webpack

(สิ่งนี้ถือว่าคุณอยู่ในไดเร็กทอรีพร้อมกับคุณpackage.jsonและคุณได้เรียกใช้แล้วnpm install webpack)

npm install -g webpack-dev-server จะแก้ปัญหาของคุณ

ลองลบnode_modulesในไดเรกทอรีท้องถิ่นและอีกครั้งวิ่งNPM ติดตั้ง

เพิ่มคำสั่ง webpack เป็นสคริปต์ npm ใน package.json ของคุณ

{
    "name": "react-app",
    "version": "1.0.0",
    "scripts": {
      "compile": "webpack --config webpack.config.js"
    }
}

จากนั้นเรียกใช้

npm รันคอมไพล์

เมื่อติดตั้ง webpack แล้วจะสร้างไบนารีในโฟลเดอร์. / โหนด_modules/.bin สคริปต์ npm ยังค้นหาไฟล์ปฏิบัติการที่สร้างขึ้นในโฟลเดอร์นี้

ขณะนี้ Webpack CLI อยู่ในแพ็คเกจแยกต่างหากและต้องติดตั้งทั่วโลกเพื่อใช้คำสั่ง 'webpack':

npm install -g webpack-cli

แก้ไข:มีการเปลี่ยนแปลงมากมาย คน Webpack ไม่แนะนำให้ติดตั้ง CLI ทั่วโลก (หรือแยกต่างหากสำหรับเรื่องนั้น) ปัญหานี้ควรได้รับการแก้ไขแล้ว แต่คำสั่งติดตั้งที่เหมาะสมคือ:

npm install --save-dev webpack

เดิมทีคำตอบนี้มีวัตถุประสงค์เพื่อเป็น "วิธีแก้ไข" สำหรับปัญหา OPs

คุณต้องติดตั้ง webpack และ webpack-cli ในขอบเขตเดียวกัน

npm i -g webpack webpack-cli

หรือ,

npm i webpack webpack-cli

หากคุณติดตั้งในเครื่องคุณจำเป็นต้องเรียกมันว่าเฉพาะ

node_modules/.bin/webpack -v

เราประสบปัญหานี้เช่นกันและฉันชอบคำตอบทั้งหมดที่แนะนำให้ใช้สคริปต์ที่กำหนดไว้ใน package.json .

สำหรับโซลูชันของเราเรามักใช้ลำดับต่อไปนี้:

1. npm install --save-dev webpack-cli(หากคุณใช้ webpack v4 หรือใหม่กว่าให้ใช้งานnpm install --save-dev webpackโปรดดูการติดตั้ง webpackเรียกคืน 19 ม.ค. 2019)
2. npx webpack

ขั้นตอนที่ 1 เป็นเพียงครั้งเดียว ขั้นตอนที่ 2 ./node_modules/.binนอกจากนี้ยังมีการตรวจสอบ คุณสามารถเพิ่มขั้นตอนที่สองเป็นสคริปต์ npm ได้package.jsonเช่นกัน:

{
   ...
   "scripts": {
      ...
      "build": "npx webpack --mode development",
      ...
   },
   ...
}

จากนั้นใช้npm run buildเพื่อเรียกใช้สคริปต์นี้

ทดสอบโซลูชันนี้กับ npm เวอร์ชัน 6.5.0, webpack เวอร์ชัน 4.28.4 และ webpack-cli เวอร์ชัน 3.2.1 บน Windows 10 โดยเรียกใช้คำสั่งทั้งหมดภายในหน้าต่าง PowerShell เวอร์ชัน nodejs ของฉันคือ / คือ 10.14.2 ฉันยังทดสอบสิ่งนี้บน Ubuntu Linux เวอร์ชัน 18.04

ฉันไม่แนะนำให้ติดตั้ง webpack ทั่วโลกโดยเฉพาะอย่างยิ่งหากคุณกำลังทำงานกับโครงการต่างๆจำนวนมากซึ่งแต่ละโครงการอาจต้องใช้ webpack เวอร์ชันอื่น การติดตั้ง webpack ทั่วโลกจะล็อกคุณไปยังเวอร์ชันใดเวอร์ชันหนึ่งในทุกโปรเจ็กต์ในเครื่องเดียวกัน

บางทีการติดตั้งใหม่ทั้งหมดจะช่วยแก้ปัญหาได้ "คำสั่ง" นี้จะลบโมดูลก่อนหน้านี้ทั้งหมดและติดตั้งใหม่บางทีในขณะที่ดาวน์โหลดและติดตั้งโมดูล webpack ไม่สมบูรณ์

npm clean-install

ฉันมีปัญหาเดียวกันและเพิ่งเพิ่มบล็อกรหัสลงในไฟล์ package.json ของฉัน

 "scripts": {
   "build": "webpack -d --progress --colors"
 }

จากนั้นเรียกใช้คำสั่งบนเทอร์มินัล

npm run build

ติดตั้ง WebPack ทั่วโลก

npm install --global webpack

เพียงแค่เรียกใช้บรรทัดคำสั่ง (cmd) ของคุณในฐานะผู้ดูแลระบบ

หากคุณเพิ่งโคลน repo ก่อนอื่นคุณต้องเรียกใช้

npm install

ข้อผิดพลาดที่คุณได้รับจะถูกสร้างขึ้นหากคุณไม่มีการอ้างอิงโครงการ คำสั่งดังกล่าวจะดาวน์โหลดและติดตั้ง

npx webpack

มันได้ผลสำหรับฉัน ฉันใช้ Windows 10 และติดตั้ง webpack ไว้ในเครื่อง

ผมมีปัญหานี้เมื่ออัพเกรดReact 16.12.0

ฉันมีข้อผิดพลาดสองข้อหนึ่งเกี่ยวกับwebpackและอีกข้อเกี่ยวกับร้านค้าเมื่อแสดงผล DOM

ข้อผิดพลาดของ Webpack:

ไม่รู้จัก webpack เป็นคำสั่งภายในหรือภายนอกโปรแกรมที่ใช้งานได้หรือไฟล์แบตช์

โซลูชัน Webpack:

1. ปิด VS Solution ที่เกี่ยวข้อง
2. ลบnode_modulesโฟลเดอร์
3. ลบ package-lock.json
4. npm install
5. npm rebuild
6. ทำซ้ำ 2-3 ครั้ง

ข้อผิดพลาดของร้านค้า:

พิมพ์ Store <()> ไม่สามารถกำหนดให้พิมพ์ Store <any, AnyAction> ได้

โซลูชันร้านค้า:

คำแนะนำในการอัปเดตเวอร์ชัน React ของฉันไม่ได้แก้ไขข้อผิดพลาดนี้ให้ฉัน แต่ไม่ว่าฉันจะแนะนำให้ทำอย่างไร

รหัสของฉันมีลักษณะดังนี้:

ReactDOM.render(
        <Provider store={store as any}>
            <ConnectedApp />
        </Provider>,
        document.getElementById('app')
    );

ตามแนวทางนี้

ฉันได้รับข้อผิดพลาดเดียวกันไม่มีวิธีแก้ปัญหาใด ๆ สำหรับฉันฉันติดตั้งโหนดใหม่และซ่อมแซมสภาพแวดล้อมของฉันทุกอย่างทำงานได้อีกครั้ง

สำหรับฉันมันใช้งานได้เพื่อติดตั้ง webpack แยกต่างหาก เพียงแค่:

$npm install
$npm install webpack

ฉันไม่แน่ใจว่าทำไมถึงจำเป็น แต่มันก็ใช้ได้

คำสั่งด้านล่างนี้ใช้ได้ผลสำหรับฉัน

npm cache clean --force
npm install -g webpack

หมายเหตุ - เรียกใช้คำสั่งเหล่านี้ในฐานะผู้ดูแลระบบ เมื่อติดตั้งแล้วให้ปิดพรอมต์คำสั่งของคุณและรีสตาร์ทเพื่อดูการเปลี่ยนแปลงที่ใช้

หากคุณสร้างโฟลเดอร์ต้นแบบสำหรับโปรเจ็กต์ JS ของคุณเพื่อให้คุณสามารถใช้โมดูล JS ได้webpackและBabelเป็นเครื่องมือที่ยอดเยี่ยม

อย่าติดตั้งwebpackทั่วโลกและหลังจากติดตั้งทั้งสองเวอร์ชันล่าสุดpackage.jsonไฟล์ของคุณจะโหลดขึ้นมาและพร้อมที่จะคัดลอกสำหรับโครงการในอนาคต

ตรวจสอบให้แน่ใจที่จะลบnode_modulesโฟลเดอร์เพื่อลดขนาดไฟล์ในโฟลเดอร์สำเร็จรูปของคุณแล้วติดตั้ง node_modules npm installใช้

ฉันลืมเรียกใช้การติดตั้ง npm และได้รับข้อผิดพลาดนี้เมื่อพยายามเรียกใช้เซิร์ฟเวอร์ webpack dev-server จนกว่าฉันจะรู้ว่าต้องเรียกใช้ npm installเพื่อติดตั้งnode_modulesจากนั้นจึงใช้งานได้

ลองคนนี้ cli ต้องได้รับการอัปเดตเป็นเวอร์ชันล่าสุด

npm install --save-dev @angular/cli@latest

เครดิตไปที่ R.Richards https://stackoverflow.com/a/44526528/1908827

การแก้ไขสำหรับฉันคือการติดตั้ง webpack ในเครื่องเป็น devDependency แม้ว่าฉันจะมีมันเนื่องจากdevDependenciesไม่ได้ติดตั้งในโฟลเดอร์ node_modules ฉันก็เลยวิ่ง npm install --only=dev

บางครั้งnpm install -g webpackไม่ได้บันทึกอย่างถูกต้อง ดีกว่าที่จะใช้npm ติดตั้ง webpack -บันทึก มันได้ผลสำหรับฉัน

ฉันมีปัญหาเดียวกันนี้และฉันคิดไม่ออก ฉันอ่านโค้ดทุกบรรทัดและไม่พบข้อผิดพลาด จากนั้นฉันก็รู้ว่าฉันติดตั้ง webpack ในโฟลเดอร์ที่ไม่ถูกต้อง ข้อผิดพลาดของฉันไม่ได้ให้ความสนใจกับโฟลเดอร์ที่ฉันกำลังติดตั้ง webpack