หน้าแรก>ซอร์สโค้ด ASP>หมวดหมู่อื่นๆ
ดาวน์โหลด

คำอธิบาย

React Core Boilerplate เป็นจุดเริ่มต้นสำหรับการสร้างแอพพลิเคชั่นเว็บสากล/isomorphic React ด้วย ASP.NET Core 3 และการแสดงผลฝั่งเซิร์ฟเวอร์ ทั้งหมดทำงานได้ดีนอกกรอบ นอกจากนี้ยังเป็นประโยชน์สำหรับมือใหม่ โครงการมีระบบการอนุญาตปลอม ดังนั้นคุณสามารถเปลี่ยนเป็นตัวตนหรืออื่น ๆ
มีเวอร์ชัน Typescript และ JavaScript ⚡

ตลาด Visual Studio

ภาพหน้าจอ

การเปลี่ยนแปลง

v. 2.0.3 (2020-07-03)
  • เพิ่มการสนับสนุนนักเทียบท่า -
  • เพิ่มการป้องกันการโจมตีของ XSS ด้วย Xuhaojun
  • อัปเดตการพึ่งพา, ลบเนมสเปซที่ไม่ได้ใช้
v. 2.0.0 (2020-05-08)
  • ย้ายไปยัง . NET Core 3.1 -
  • ย้ายไปยัง Bootstrap 4 โดยใช้ React-Bootstrap
  • อพยพไปยัง Formik
  • Redux จัดเก็บอพยพไปยัง Redux Toolkit เพื่อเพิ่มการพัฒนาด้วย Redux รหัสลดลง
  • การปรับปรุงการบันทึกและการกำหนดค่า Serilog
  • เพิ่มการสนับสนุน HTTPS ใน server-side rendering
  • เพิ่มรหัสสถานะที่แก้ไขได้ในเส้นทางสำหรับ SEO
  • อัปเดตการพึ่งพาบางอย่าง
  • การแก้ไขความมั่นคง
  • ลบการพึ่งพา NPM ที่ไม่จำเป็น
v. 1.7.1 (2019-06-02)
  • อัพเดท React , Redux , React-Router และแพ็คเกจ NPM อื่น ๆ ที่เชื่อมต่อกับพวกเขา
  • อัปเดตการพึ่งพา NPM ที่สำคัญ
  • ลบการพึ่งพา NPM ที่ไม่จำเป็น
v. 1.7.0 (2019-05-05)
  • การปรับโครงสร้างที่เก็บ
  • เพิ่มเวอร์ชัน JavaScript ของ React Core Boilerplate -
  • การแก้ไขความมั่นคง
  • อัปเดตการพึ่งพาที่สำคัญ
v. 1.6.3 (2019-03-19)
  • ลบ image-webpack-loader เนื่องจากความไม่แน่นอน
v. 1.6.2 (2019-03-15)
  • ติดตั้งปลั๊กอินเทอร์ Terser ที่เสถียร
  • อัปเดต React และแพ็คเกจอื่น ๆ สำหรับมัน (รวมถึงประเภท)
  • อัปเดต WebPack
  • อัปเดต WebPack Config สำหรับโหมดการพัฒนา
v. 1.6.0 (2019-03-13)
  • อัปเดต .NET Core ขึ้นอยู่กับ v. 2.2
  • อัปเดตแพ็คเกจ NPM ที่สำคัญ
  • อัปเดตการพึ่งพา WebPack
  • ปรับปรุงผู้ขาย WebPack และการกำหนดค่าชุด
  • ปรับปรุงไฟล์ .csproj สำหรับการสร้างและการเผยแพร่สถานการณ์
  • แก้ไขการสร้างแผนที่แหล่งที่มาในโหมดการพัฒนา
  • การรวบรวมชุดรวมในโหมดการผลิต
  • การแก้ไขความมั่นคงอื่น ๆ
v. 1.5.4 (2019-02-04)
  • เพิ่มคุณสมบัติเล็กน้อย
  • การแก้ไขข้อผิดพลาด: collapsing of the Bootstrap navigation bar , fixed controller and frontend's service in person update case
  • อัปเดตการพึ่งพา
v. 1.5.3 (2018-12-04)
  • เพิ่มโพลีฟิลล์สำหรับการสนับสนุน IE9, IE11: @babel/polyfill , custom-event-polyfill
  • อัปเดตการพึ่งพา
v. 1.5.2 (2018-12-01)
  • เพิ่ม FullText Live Search เป็นตัวอย่าง
  • เพิ่มปลั๊กอิน webpack: case-sensitive-paths-webpack-plugin , react-dev-utils
  • เพิ่มปลั๊กอินพร้อมตัวอย่าง: awesome-debounce-promise เพื่อป้องกันไม่ให้มีการสืบค้นบ่อยครั้งในการค้นหาสด formik เพื่อสร้างแบบฟอร์มในการตอบสนองโดยไม่ต้องน้ำตา
  • แก้ไขข้อผิดพลาดในการใช้งานและข้อความ
v. 1.5.0 (1) (2018-11-07)
  • เพิ่ม hosting.json ซึ่งมีการตั้งค่าโฮสติ้งและจะใช้ในการสร้างการผลิต
  • เพิ่มแพ็คเกจและตัวอย่างของ bind-decorator ด้วย
  • เร่งความเร็วของอาคาร Webpack Bundle
  • อัปเดตแพ็คเกจการรอโดเมน การอัปเดตนี้ช่วยให้คุณสามารถป้องกันการเรียกร้องให้มีการร้องขอการดึงข้อมูล isomorphic สองครั้ง (ในเซิร์ฟเวอร์ก่อนและหลังจากนั้น - บนฝั่งไคลเอ็นต์)
  • อัปเดตแพ็คเกจ Redux-Thunk
  • เพิ่มส่วนประกอบ React ใหม่เพื่อป้องกันอาการปวดหัวเมื่อคุณสร้างเว็บแอปพลิเคชัน: ModalComponent , Input , MultiSelect , Form ส่วนประกอบเหล่านี้ใช้ในตัวอย่าง
v. 1.4.5 (2018-11-02)
  • คุณลักษณะใหม่ที่เพิ่มช่วยให้เว็บแอปพลิเคชันแชร์คุกกี้ของเบราว์เซอร์กับ NodeServices ขณะนี้ SSR สร้างรหัส HTML สำหรับผู้ใช้ที่ได้รับการรับรองความถูกต้องและทำให้คำขอ isomorphic ที่ผ่านการรับรองความถูกต้อง
  • เพิ่มเมธอด sendFormData ไปยัง ServiceBase.ts ซึ่งช่วยให้คุณสามารถอัปโหลดไฟล์ไปยังเซิร์ฟเวอร์
v. 1.3.5 (2018-10-26)
  • อัปเดตแพ็คเกจ NPM: react , redux , react-router
  • แทนที่เนื่องจากการเสื่อมราคา react-router-redux โดย connected-react-router ใหม่
  • แก้ไขส่วนประกอบ Loader ซึ่งมีปัญหาในบางกรณี
v. 1.3.2 (2018-10-25)
  • ลบแพ็คเกจ NPM ที่ไม่ได้ใช้
  • เพิ่ม package-lock.json
  • โครงการคงที่
v. 1.3.0 (2018-10-22)
  • อัปเดตแพ็คเกจ React
  • เพิ่มส่วนประกอบ AppComponent ซึ่งช่วยให้คุณสามารถทำ "การอัปเดตแบบบังคับ" ของส่วนประกอบ "ติดอยู่" (สำหรับส่วนประกอบของ Loader ใน LoginPage )
  • เพิ่ม serilog logger ซึ่งเข้าสู่ไฟล์ ( logs/ ไดเรกทอรี) และไปยังผู้ให้บริการคลาวด์ Azure
v. 1.2.1 (2018-10-20)
  • แก้ไขส่วนประกอบ Loader ซึ่งทำงานไม่ถูกต้องกับ SSR ในบางกรณี
v. 1.2.0 (2018-10-18)
  • อัปเดตการพึ่งพาของแพ็คเกจ "ASP.NET Core" เนื่องจากช่องโหว่
  • คุณลักษณะที่เพิ่มเข้ามาซึ่งช่วยให้คุณสามารถส่งวัตถุ JSON ไปยัง URL แบบสอบถามสำหรับวิธีการรับและลบ
v. 1.1.0 (2018-10-16)
  • แก้ไขส่วนประกอบ AppRoute แก้ไขปัญหาด้วยการส่งผ่านพารามิเตอร์ไปยังส่วนประกอบจากเราเตอร์ React หากคุณต้องการแก้ไขด้วยตนเองให้ดูการกระทำที่นี่

การใช้งาน

การติดตั้ง

  1. ติดตั้ง. NET CORE SDK ล่าสุดและ Runtime By Link
  2. การติดตั้ง Node.js ที่เสถียรล่าสุด
  3. ในการดำเนินการครั้งแรกคุณต้องปิดโครงการหากทำงานใน Visual Studio หรือ IDE อื่น เปิดโฟลเดอร์ของโครงการในคอนโซลและเรียกใช้คำสั่ง npm install
  4. ดำเนินการคำสั่งต่อไปนี้เพื่อการพัฒนาในไดเรกทอรีโครงการของคุณ มันจะรวบรวมชุดหลักและกลุ่มผู้ขาย 
npm run build:dev
  1. หากคุณใช้ Visual Studio 20XX แทนที่จะเป็น IIS Express เลือกชื่อ YourProjectName หรือ ReactCoreBoilerplate : คลิกที่ลูกศรลงใกล้กับ IIS Express และเลือก Docker หรือตัวเลือกอื่น ๆ
  2. สร้างและเรียกใช้โครงการ มันจะเริ่มในคอนโซล Windows

แก้ไขการกำหนดค่าผู้ขาย webpack

หากคุณแก้ไขการกำหนดค่าผู้ขาย WebPack คุณต้องคอมไพล์กลุ่มผู้ขายอีกครั้งด้วยตนเอง ดำเนินการคำสั่งต่อไปนี้ในไดเรกทอรีโครงการของคุณเพื่อทำสิ่งนี้: 

npm run build:dev

เรียกใช้กับนักเทียบท่า

Visual Studio 20xx

เพียงเลือกตัวเลือก Docker ในแถบเครื่องมือ

สร้างคอนเทนเนอร์

ดำเนินการคำสั่งต่อไปนี้ในไดเรกทอรีโครงการของคุณ: 

docker build -t [my image name] .

ที่ [my image name] ชื่อภาพนักเทียบท่าของคุณ

เรียกใช้คอนเทนเนอร์การผลิตบน Windows ด้วยการสนับสนุน HTTPS (สำหรับการทดสอบ)

  1. เชื่อถือใบรับรองการพัฒนา HTTPS CORE ASP.NET บน Windows และ MacOS: 
dotnet dev-certs https -ep %USERPROFILE% . aspnet h ttps a spnetapp.pfx -p [my password]

[my password] คือรหัสผ่านของคุณ
2. ดำเนินการ: 

dotnet dev-certs https --trust
  1. สร้างคอนเทนเนอร์ของคุณ
  2. ดำเนินการ: 
docker run --rm -it -p 7000:7000 -p 7001:7001 -e ASPNETCORE_URLS= " https://+;http://+ " -e ASPNETCORE_Kestrel__Certificates__Default__Password= " [my password] " -e ASPNETCORE_Kestrel__Certificates__Default__Path=/https/aspnetapp.pfx -v %USERPROFILE% . aspnet h ttps:/https/ [my image name]

โดยที่ [my password] - รหัสผ่านใบรับรองของคุณ (จากขั้นตอนที่ 1), [my image name] - ชื่อภาพนักเทียบท่าของคุณ

องค์ประกอบ

ห้องสมุดบุคคลที่สาม:

  • TypeScript - ส่วนหน้าทั้งหมดขึ้นอยู่กับ typeScript
  • Fork-TS-Checker-Webpack-Plugin-ปลั๊กอิน WebPack ที่เรียกใช้ตัวตรวจสอบประเภท typeScript ในกระบวนการแยกต่างหาก
  • React - ห้องสมุดหลักที่ทำงานเป็น isomorphic
  • เราเตอร์ตอบสนอง - เราเตอร์สำหรับ React
  • React -Bootstrap - Bootstrap 4 สำหรับ React
  • React -Helmet - ผู้ช่วย SEO isomorphic
  • Redux - เก็บ
  • Redux Toolkit - ห้องสมุดเพื่อเพิ่มการพัฒนาด้วย Redux
  • Formik - ห้องสมุดสำหรับการสร้างแบบฟอร์มสำหรับ React
  • เราเตอร์ React ที่เชื่อมต่อ - การผูก Redux สำหรับเราเตอร์ React
  • SASS - CSS preprocessor
  • Webpack 4 - Bundler
  • Axios - isomorphic fetch util
  • TS-NAMEOF-อนุญาตให้คุณใช้ชื่อประเภทอินพุตที่ปลอดภัยในรูปแบบ
  • JSON-to-URL-ช่วยให้คุณสามารถส่งวัตถุ JSON ไปยัง URL แบบสอบถามสำหรับวิธีการรับและลบ
  • Serilog - ช่วยให้คุณสามารถเข้าสู่ไฟล์ ( logs/ ไดเรกทอรี) และไปยังผู้ให้บริการคลาวด์ Azure

ห้องสมุด / ส้อมคงที่:

  • Domain-Wait-Domain-Task Replacement ด้วย Async/Await Support และคุณสมบัติใหม่
  • NVAL-การตรวจสอบความถูกต้องของวานิลลา JS-Validation JS
  • Nval -Tippy - การตรวจสอบวานิลลา JS พร้อมคำแนะนำเครื่องมือที่ยอดเยี่ยม
  • NserializeJson - รูปแบบที่ยืดหยุ่นกับ JSON Serializer ตามวานิลลา JS

ปัญหา

ปัญหาที่รู้จัก

  • ข้อผิดพลาดใน ./clientapp/styles/loaders/xxx.scss (./node_modules/css-loader/dist/cjs.js!
    ดำเนินการ npm i และ npm rebuild node-sass ในไดเรกทอรีโครงการของคุณ

  • Webpack Hot Module Replacement [HMR] ไม่ทำงานกับ IIS
    จะได้รับการแก้ไข ใช้ Kestrel เพื่อการพัฒนาแทน

  • ข้อผิดพลาด http 500
    คุณอาจไม่มีเวอร์ชันล่าสุดของ Node.js

  • ข้อผิดพลาด http 502.5
    คุณต้องติดตั้ง "ASP.NET CORE SDK" และ "Hosting Bundle" ล่าสุดโดยใช้ลิงค์นี้: https://www.microsoft.com/net/download/dotnet-core/2.1

  • ข้อผิดพลาด http 500 เมื่อโฮสต์ใน Azure
    ตั้งค่า "sweet_node_default_version" เป็น 6.11.2 ใน "การตั้งค่าแอป" ใน Azure

  • ข้อผิดพลาดเมื่อทำงานในโหมดการพัฒนาหลังจากเผยแพร่
    ดำเนินการ npm run build:dev ใน DIR ของโครงการ

ปัญหาอื่น ๆ

  • หากคุณจะมีปัญหาใด ๆ กับการเริ่มต้นโครงการคุณสามารถดูข้อผิดพลาดในบันทึก ("/logs" ไดเรกทอรี) กรุณาทำสิ่งนี้ก่อนที่จะเปิดปัญหาเกี่ยวกับ GitHub อย่าลืมพูดถึงเวอร์ชันของ React Core Boilerplate ( JavaScript หรือ TypeScript )

ใบอนุญาต

มิกซ์

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