Vm2: Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ vm2 совмСстимым с Webpack

Π‘ΠΎΠ·Π΄Π°Π½Π½Ρ‹ΠΉ Π½Π° 26 Π°ΠΏΡ€. 2017  Β·  5ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ  Β·  Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ: patriksimek/vm2

  • [x] Π²Ρ‹ΡΡΠ½ΠΈΡ‚ΡŒ, ΠΊΠ°ΠΊ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ coffee-script require Π±Π΅Π· Π½Π°Ρ€ΡƒΡˆΠ΅Π½ΠΈΡ ΠΎΠ±Ρ€Π°Ρ‚Π½ΠΎΠΉ совмСстимости
  • [] рисунок, ΠΊΠ°ΠΊ ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ Π²Π΅Π±-ΠΏΠ°ΠΊΠ΅Ρ‚Ρƒ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΡΡ‚ΡŒ скрипты, Π·Π°Π³Ρ€ΡƒΠΆΠ°Π΅ΠΌΡ‹Π΅ Ρ‡Π΅Ρ€Π΅Π· fs - sandbox.js ΠΈ contexttify.js
feature request help wanted

Π‘Π°ΠΌΡ‹ΠΉ ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π•ΡΡ‚ΡŒ Π»ΠΈ прогрСсс ΠΏΠΎ этому вопросу? Π’ΠΎΡ‚ Π»ΡƒΡ‡ΡˆΠΈΠΉ ΠΈ, вСроятно, самый простой способ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ vm2 совмСстимым с Webpack . НС Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ Π½ΠΈΠΊΠ°ΠΊΠΈΡ… ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Π² самом vm2 , всСго 3 строки Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ ΠΈ простой скрипт NPM:

  1. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ package.json Π² ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³Π΅ output/ :
{
    "dependencies": {
        "vm2": "latest"
    }
}
  1. ΠžΡ‚ΠΌΠ΅Ρ‚ΡŒΡ‚Π΅ vm2 ΠΊΠ°ΠΊ внСшнюю Π±ΠΈΠ±Π»ΠΈΠΎΡ‚Π΅ΠΊΡƒ Π² ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ Webpack:
externals: {
    "vm2": "require('vm2')"
}
  1. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ скрипт Π² NPM, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ устанавливаСт зависимости Π² ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³ output/ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Webpack Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ всС ΠΎΠΏΠ΅Ρ€Π°Ρ†ΠΈΠΈ:
"scripts": {
    "prepare-output": "cd output && npm install",
    "prepare": "webpack --progress && npm run prepare-output"
}

ВсС 5 ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Другая ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠ° - require . Π₯отя webpack просто Π³Π΅Π½Π΅Ρ€ΠΈΡ€ΡƒΠ΅Ρ‚ прСдупрСТдСния, для этого Ρ‚Ρ€Π΅Π±ΡƒΡŽΡ‚ΡΡ:

WARNING in ./~/vm2/lib/main.js
147:26-33 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

WARNING in ./~/vm2/lib/main.js
251:3-10 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

WARNING in ./~/vm2/lib/main.js
295:26-33 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

webpack фактичСски Π·Π°ΠΌΠ΅Π½ΠΈΠ» эти require Π½Π° exceptions :
НапримСр, ΠΏΠ΅Ρ€Π΅Π΄ webpack:

        Reflect.defineProperty(this, '_internal', {
            value: vm.runInContext(`(function(require, host) { ${cf} \n})`, this._context, {
                filename: `${__dirname}/contextify.js`,
                displayErrors: false
            }).call(this._context, require, host)
        });

ПослС Π²Π΅Π±-ΠΏΠ°ΠΊΠ΅Ρ‚Π°:

        Reflect.defineProperty(this, '_internal', {
            value: vm.runInContext(`(function(require, host) { ${cf} \n})`, this._context, {
                filename: `${__dirname}/contextify.js`,
                displayErrors: false
            }).call(this._context, !(function webpackMissingModule() { var e = new Error("Cannot find module \".\""); e.code = 'MODULE_NOT_FOUND'; throw e; }()), host)
        });

Π—Π°ΠΌΠ΅Π½Π° require Π½Π° eval('require') ΠΌΠΎΠΆΠ΅Ρ‚ Ρ€Π΅ΡˆΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ для мСня. Π˜Π½Ρ‚Π΅Ρ€Π΅ΡΠ½ΠΎ, Π΅ΡΡ‚ΡŒ Π»ΠΈ Π»ΡƒΡ‡ΡˆΠ΅Π΅ Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅.

Π•ΡΡ‚ΡŒ Π»ΠΈ прогрСсс ΠΏΠΎ этому вопросу? Π’ΠΎΡ‚ Π»ΡƒΡ‡ΡˆΠΈΠΉ ΠΈ, вСроятно, самый простой способ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ vm2 совмСстимым с Webpack . НС Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ Π½ΠΈΠΊΠ°ΠΊΠΈΡ… ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΉ Π² самом vm2 , всСго 3 строки Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ ΠΈ простой скрипт NPM:

  1. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ package.json Π² ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³Π΅ output/ :
{
    "dependencies": {
        "vm2": "latest"
    }
}
  1. ΠžΡ‚ΠΌΠ΅Ρ‚ΡŒΡ‚Π΅ vm2 ΠΊΠ°ΠΊ внСшнюю Π±ΠΈΠ±Π»ΠΈΠΎΡ‚Π΅ΠΊΡƒ Π² ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΠΈ Webpack:
externals: {
    "vm2": "require('vm2')"
}
  1. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ скрипт Π² NPM, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ устанавливаСт зависимости Π² ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³ output/ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Webpack Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ всС ΠΎΠΏΠ΅Ρ€Π°Ρ†ΠΈΠΈ:
"scripts": {
    "prepare-output": "cd output && npm install",
    "prepare": "webpack --progress && npm run prepare-output"
}

ΠŸΡ€ΠΈΠ²Π΅Ρ‚ !

Π£ мСня такая ΠΆΠ΅ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠ°, ΠΈ Π²ΠΎΡ‚ ΠΊΠ°ΠΊ я Π΅Π΅ Ρ€Π΅ΡˆΠΈΠ»:

  1. Π’ΠΎ-ΠΏΠ΅Ρ€Π²Ρ‹Ρ…, я Π½Π΅ ΠΌΠΎΠ³Ρƒ Π½Π°ΠΏΡ€ΡΠΌΡƒΡŽ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΌΠΎΠ΄ΡƒΠ»ΡŒ Π² качСствС модуля npm, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ ΠΌΠ½Π΅ ΠΏΡ€ΠΈΡˆΠ»ΠΎΡΡŒ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ источники, поэтому я c / c lib Π² ΠΏΠ°ΠΏΠΊΠ΅ ΠΌΠΎΠ΅Π³ΠΎ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π° (это всСго нСсколько Ρ„Π°ΠΉΠ»ΠΎΠ², с этим ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌ Π½Π΅Ρ‚)

  2. О fs для sandbox.js / contexttify.js: я ΠΏΠ΅Ρ€Π΅ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Π» ΠΈΡ… Π² sandbox.txt ΠΈ contexttify.txt, Π° Π·Π°Ρ‚Π΅ΠΌ использовал raw-Π·Π°Π³Ρ€ΡƒΠ·Ρ‡ΠΈΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒ ΠΈΡ… ΠΊΠ°ΠΊ ΠΎΠ±Ρ‹Ρ‡Π½Ρ‹ΠΉ тСкст.

main.js (Π²Π²Π΅Ρ€Ρ…Ρƒ)

const sb = require('./sandbox.txt');
const cf = require('./contextify.txt');

webpack.config.js

{
    test: /\.txt$/,
    use: 'raw-loader'
}

НС Π·Π°Π±ΡƒΠ΄ΡŒΡ‚Π΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ всС ссылки sandbox.js / contexttify.js Π½Π° sandbox.txt / contexttify.txt Π² main.js.

  1. ПослСдняя слоТная Ρ‡Π°ΡΡ‚ΡŒ, трСбуСтся: для NodeVM я ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ» ΠΎΠ΄Π½Ρƒ строку

main.js (ΠΎΠΊΠΎΠ»ΠΎ строки 250)

[...]
const host = {
    version: parseInt(process.versions.node.split('.')[0]),
    require: eval('require'),
    process,
    console,
[...]

Π― ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ» "require" Π½Π° "require: eval ('require')", Ρ‡Ρ‚ΠΎΠ±Ρ‹ webpack Π½Π΅ измСнял Π΅Π³ΠΎ (ΠΊΠ°ΠΊ ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Π΅Ρ‚ Coxxs), ΠΈ это ΠΏΠΎΠΌΠΎΠ³Π»ΠΎ.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ я ΠΌΠΎΠ³Ρƒ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ vm2, Π½Π΅ Π½ΡƒΠΆΠ΄Π°ΡΡΡŒ Π² Π½Π΅ΠΌ ΠΊΠ°ΠΊ Π²ΠΎ внСшнСй Π±ΠΈΠ±Π»ΠΈΠΎΡ‚Π΅ΠΊΠ΅.
Π― знаю, Ρ‡Ρ‚ΠΎ это довольно слоТно ΠΈ Π½Π΅ ΠΎΡ‡Π΅Π½ΡŒ чисто, Π½ΠΎ это СдинствСнноС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Ρƒ мСня Π΅ΡΡ‚ΡŒ.
Π― надСюсь, Ρ‡Ρ‚ΠΎ это ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ ΠΈΠ· вас, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Π² Ρ€Π΅Π°Π»ΡŒΠ½ΠΎΠΌ исправлСнии.

Если Ρƒ вас Π΅ΡΡ‚ΡŒ Π»ΡƒΡ‡ΡˆΠΈΠ΅ Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ, ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ Ρ€Π°Π΄Ρ‹ ΠΈΡ… ΡƒΡΠ»Ρ‹ΡˆΠ°Ρ‚ΡŒ! :)

Π­Ρ‚Π° ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠ° Π±Ρ‹Π»Π° автоматичСски ΠΏΠΎΠΌΠ΅Ρ‡Π΅Π½Π° ΠΊΠ°ΠΊ ΡƒΡΡ‚Π°Ρ€Π΅Π²ΡˆΠ°Ρ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Π² послСднСС врСмя Π½Π΅ Π±Ρ‹Π»ΠΎ активности. Он Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°ΠΊΡ€Ρ‹Ρ‚, Ссли большС Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ активности. Бпасибо Π·Π° ваш Π²ΠΊΠ»Π°Π΄.

FWIW - объСдинСниС с Webpack 5 с Ρ†Π΅Π»Π΅Π²Ρ‹ΠΌ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ΠΌ node ΠΏΠΎΡ…ΠΎΠΆΠ΅, Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚.

Π‘Ρ‹Π»Π° Π»ΠΈ эта страница ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ?
0 / 5 - 0 Ρ€Π΅ΠΉΡ‚ΠΈΠ½Π³ΠΈ

Π‘ΠΌΠ΅ΠΆΠ½Ρ‹Π΅ вопросы

KonradLinkowski picture KonradLinkowski  Β·  10ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

patriksimek picture patriksimek  Β·  15ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

karthikv picture karthikv  Β·  15ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

CapacitorSet picture CapacitorSet  Β·  13ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

ghost picture ghost  Β·  23ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ