Skip to content

πŸ”§ ΠŸΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ webpack.DllPlugin ΠΈ webpack.DllReferencePlugin

Notifications You must be signed in to change notification settings

vansosnin/webpack-dll-example

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

9 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Webpack DllPlugin

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ webpack.DllPlugin для ΡΡ‚Π°Ρ‚ΡŒΠΈ Π½Π° habrahabr.

Запуск

Π§Ρ‚ΠΎΠ±Ρ‹ локально Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅ шаги:

  • УстановитС зависимости

    npm install
    
  • Π‘ΠΎΠ±Π΅Ρ€ΠΈΡ‚Π΅ development-Π²Π΅Ρ€ΡΠΈΡŽ:

    npm run build:dll
    npm run build
    

    ​

  • Или собСритС production-Π²Π΅Ρ€ΡΠΈΡŽ:

    npm run deploy
    

ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎ Π² Π΄Π°Π½Π½ΠΎΠΌ случаС Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ ΡΠΎΠ±ΠΈΡ€Π°Ρ‚ΡŒ dll, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ ΠΎΠ½ ΡƒΠΆΠ΅ собран ΠΈ Π»Π΅ΠΆΠΈΡ‚ Π² Ρ€Π΅ΠΏΠΎΠ·ΠΈΡ‚ΠΎΡ€ΠΈΠΈ.

Π§Ρ‚ΠΎ ΠΈΠΌΠ΅Π½Π½ΠΎ Π΄Π΅Π»Π°Π΅Ρ‚ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΈΠ· скриптов, ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π² package.json Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ scripts.

  • ΠžΡ‚ΠΊΡ€ΠΎΠΉΡ‚Π΅ index.html

ОписаниС

На Ρ‡Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ (ΠΊΡ€ΠΎΠΌΠ΅ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΠΎΠ²):

  • ΠΏΠ°ΠΏΠΊΠ° src β€” исходники, ΠΎΡ‡Π΅Π²ΠΈΠ΄Π½ΠΎ, ΠΎΠ½ΠΈ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π»Π΅ΠΆΠ°Ρ‚ΡŒ Π² вашСм Ρ€Π΅ΠΏΠΎΠ·ΠΈΡ‚ΠΎΡ€ΠΈΠΈ;
  • ΠΏΠ°ΠΏΠΊΠ° dist/dll/production β€” это ΠΊΠ°ΠΊ Ρ€Π°Π· прСдсобранный dll, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ Π² Ρ€Π΅ΠΏΠΎΠ·ΠΈΡ‚ΠΎΡ€ΠΈΠΉ. ΠŸΡ€ΠΈ Π΄Π΅ΠΏΠ»ΠΎΠ΅ Π½Π° production Π΅Π³ΠΎ ΠΏΠ΅Ρ€Π΅ΡΠΎΠ±ΠΈΡ€Π°Ρ‚ΡŒ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ;
  • ΠΏΠ°ΠΏΠΊΠ° example_dist β€” просто ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ²ΡˆΠΈΡ…ΡΡ Π±Π°Π½Π΄Π»ΠΎΠ² (ΠΈΡ… Ρ‚Π°ΡΠΊΠ°Ρ‚ΡŒ Π² вашСм Ρ€Π΅ΠΏΠΎΠ·ΠΈΡ‚ΠΎΡ€ΠΈΠΈ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ).

[Optional] ΠšΠΎΠΏΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ dll

Π’ Π΄Π°Π½Π½ΠΎΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ DllPlugin, dll ΡΠΎΠ±ΠΈΡ€Π°ΡŽΡ‚ΡΡ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎ для ΠΊΠ°ΠΆΠ΄ΠΎΡ‹ΠΉ срСды. НапримСр ΠΏΠΎΡ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎ Π² Ρ€Π΅ΠΆΠΈΠΌΠ΅ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ΅ ΠΌΡ‹ Ρ…ΠΎΡ‚ΠΈΠΌ Π²ΠΈΠ΄Π΅Ρ‚ΡŒ ошибки React, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π½Π΅ ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°ΡŽΡ‚ΡΡ Π² production-вСрсии. Ну ΠΈ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Ρ‹, Π² зависимости ΠΎΡ‚ стСка β€” это Π½Π΅ ΡΡ‚ΠΎΠ»ΡŒ Π²Π°ΠΆΠ½ΠΎ.

Π’Π°ΠΆΠ½ΠΎ Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Ρƒ вас dll ΠΌΠΎΠΆΠ΅Ρ‚ Π»Π΅ΠΆΠ°Ρ‚ΡŒ ΡΠΎΠ²Π΅Ρ€ΡˆΠ΅Π½Π½ΠΎ Π² Π΄Ρ€ΡƒΠ³ΠΎΠΌ мСстС, Π½Π΅ΠΆΠ΅Π»ΠΈ ваши Π±Π°Π½Π΄Π»Ρ‹. Π­Ρ‚Ρƒ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ ΠΌΠΎΠΆΠ½ΠΎ Ρ€Π΅ΡˆΠ°Ρ‚ΡŒ нСсколькими способами. Π― Π²ΠΈΠΆΡƒ 2:

  1. ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ HtmlWebpackPlugin: ΠΎΠ½ сам добавляСт Π² html Π½ΡƒΠΆΠ½Ρ‹Π΅ Ρ‚Π΅Π³ΠΈ script;
  2. ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ CopyWebpackPlugin: ΠΎΠ½ ΡƒΠΌΠ΅Π΅Ρ‚ ΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ»ΠΈΠΊΠΈ.

Π― Π²Ρ‹Π±Ρ€Π°Π» Π²Ρ‚ΠΎΡ€ΠΎΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Π΅Π³ΠΎ настройки ΠΌΠΎΠΆΠ½ΠΎ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Π² основном ΠΊΠΎΠ½Ρ„ΠΈΠ³Π΅. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ я ΠΊΠΎΠΏΠΈΡ€ΡƒΡŽ dll для Ρ‚Π΅ΠΊΡƒΡ‰Π΅ΠΉ срСды Π² ΠΏΠ°ΠΏΠΊΡƒ с Π±Π°Π½Π΄Π»Π°ΠΌΠΈ ΠΈ Π±Π΅Π· Ρ‚Ρ€ΡƒΠ΄Π° ΠΌΠΎΠ³Ρƒ ΡΠ³Π΅Π½Π΅Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π½ΡƒΠΆΠ½ΡƒΡŽ ссылку Π½Π° dll Π² html.

Π’ Π΄Π°Π½Π½ΠΎΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ Π² index.html ссылки написаны ТСстко, это сдСлано для простоты. На Π΄Π΅Π»Π΅ ΠΆΠ΅ ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ Π³Π΅Π½Π΅Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΡ€ΠΈ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π΅ вьюшки.

About

πŸ”§ ΠŸΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ webpack.DllPlugin ΠΈ webpack.DllReferencePlugin

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published