ΠΡΠΎΠ±Π»Π΅ΠΌΠ° ΠΊΠ°ΠΊ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ,
ΠΠ΅ΡΡΠΈΡ Vue: 2.5.15
ΠΠ΅ΡΡΠΈΡ Webpack: 3.11.0
ΠΠΎΠ³Π΄Π° npm run build: sandbox Π²ΡΠ΄Π°Π΅Ρ ΠΎΡΠΈΠ±ΠΊΡ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅:
ERROR in 98.145f98ef3cbd11bd2670.js from UglifyJs
Unexpected token: name (Point) [./node_modules/signature_pad/dist/signature_pad.m.js:6,0][98.145f98ef3cbd11bd2670.js:15,6]
Build failed with errors.
ΠΠΎΡ
ΠΎΠΆΠ΅, Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅ ΡΡΠ°ΡΡΡ Π²Π΅ΡΡΠΈΡ UglifyJS, ΠΊΠΎΡΠΎΡΠ°Ρ ΠΎΠ±ΡΠ°Π±Π°ΡΡΠ²Π°Π΅Ρ ΡΠΎΠ»ΡΠΊΠΎ ΠΊΠΎΠ΄ ES5. ΠΠΎΠ΄ Π² signature_pad.m.js
ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ ΡΡΠ½ΠΊΡΠΈΠΈ ES6 +. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, Π΅ΡΠ»ΠΈ Π²Ρ Ρ
ΠΎΡΠΈΡΠ΅ ΠΌΠΈΠ½ΠΈΠΌΠΈΠ·ΠΈΡΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π²Π°ΡΠ΅ΠΉ Π²Π΅ΡΡΠΈΠΈ UglifyJS, Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠ½Π°ΡΠ°Π»Π° ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΠΎΠ²Π°ΡΡ Π΅Π³ΠΎ Π΄ΠΎ ES5, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Ρ ΠΏΠΎΠΌΠΎΡΡΡ Babel. ΠΡ ΡΠ°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ signature_pad.umd.js
, ΠΊΠΎΡΠΎΡΡΠΉ ΡΠΆΠ΅ ΡΠΊΠΎΠΌΠΏΠΈΠ»ΠΈΡΠΎΠ²Π°Π½ Π΄Π»Ρ ES5.
@ kevinchung1026 ΠΡΠ΅ΡΠ°
{
test: /\.js?$/,
include: [/node_modules\/signature_pad/],
use: [
{
loader: 'babel-loader',
options: {
cacheDirectory: true,
presets: [['env', { 'modules': false, 'targets': { 'node': 4 } }]]
}
}
],
},
ΠΠ°Π΄Π΅ΡΡΡ, ΡΡΠΎ ΡΠ΅Π±Π΅ ΡΠΎΠΆΠ΅ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ π
ΡΠ΅ΠΏΠ΅ΡΡ Π²ΡΠ΅ Π² ΠΏΠΎΡΡΠ΄ΠΊΠ΅, ΡΠΏΠ°ΡΠΈΠ±ΠΎ Π²ΡΠ΅ΠΌ
Π‘ΠΎΠ³Π»Π°ΡΠ½ΠΎ https://github.com/rollup/rollup/wiki/pkg.module Π²ΡΠ΅, ΡΡΠΎ ΡΠΊΠ°Π·Π°Π½ΠΎ Π² ΠΏΠΎΠ»Π΅ module
ΡΠ°ΠΉΠ»Π° package.json, Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ ΠΌΠΎΠ΄ΡΠ»Ρ ES2015, Π½ΠΎ ΠΎΡΡΠ°Π»ΡΠ½Π°Ρ ΡΠ°ΡΡΡ ΠΊΠΎΠ΄Π° Π΄ΠΎΠ»ΠΆΠ½Π° ΡΠ»Π΅Π΄ΡΠΉΡΠ΅ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡΡ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΠΎ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎΠΉ Π²Π΅ΡΡΠΈΠΈ ΡΡΠ΅Π΄Ρ JS ΠΏΠ°ΠΊΠ΅ΡΠ°.
Π Π½Π°ΡΡΠΎΡΡΠ΅Π΅ Π²ΡΠ΅ΠΌΡ Π½Π΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΠΎΡ ΠΌΠΎΠ΄ΡΠ»Ρ ΠΈΠ· ΠΊΠΎΡΠΎΠ±ΠΊΠΈ Ρ webpack (ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΎΠ½ ΠΏΡΠ΅Π΄ΠΏΠΎΡΠΈΡΠ°Π΅Ρ module
main
) (ΡΠΌ. Https://webpack.js.org/configuration/resolve/ # resolve-mainfields) ΡΠ°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΌΠΎΠ΄ΡΠ»ΠΈ. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΡΡΠ΅Π±ΡΡΡΡΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΈΠ· ΡΡΠΈΡ
ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΡ
Π½Π°ΡΡΡΠΎΠ΅ΠΊ ΡΠΈΡΡΠ΅ΠΌΡ ΡΠ±ΠΎΡΠΊΠΈ (ΠΊΠ°ΠΊ ΡΠΊΠ°Π·Π°Π½ΠΎ Π²ΡΡΠ΅), ΡΡΠΎΠ±Ρ Π·Π°ΡΡΠ°Π²ΠΈΡΡ babel ΠΏΠ΅ΡΠ΅Π½Π΅ΡΡΠΈ ΡΡΠΎΡ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΡΠΉ ΠΌΠΎΠ΄ΡΠ»Ρ ΠΈΠ· ΠΊΠ°ΡΠ°Π»ΠΎΠ³Π° node_modules Π² ΡΠ΅Π»ΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ°.
Π― Π΄ΡΠΌΠ°Ρ, Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΏΠΎΠ»Ρ browser
Π² package.json ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π±ΡΡΡΡΡΠΌ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ.
ΠΡΠΈΠ²Π΅Ρ!
Π― ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ angular 2 ΠΈ ΡΡΠ°ΡΡΡ Π²Π΅ΡΡΠΈΡ UglifyJS, ΠΈ Ρ ΠΌΠ΅Π½Ρ Π±ΡΠ»Π° ΡΠ°ΠΊΠ°Ρ ΠΆΠ΅ ΠΠ¨ΠΠΠΠ Ρ uglifyJS + signature_pad.
Π― ΡΠ΅ΡΠΈΠ» ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΎΡΠ²Π΅ΡΠΎΠ² Π²ΡΡΠ΅, Π΄ΠΎΠ±Π°Π²ΠΈΠ² Π½ΠΎΠ²ΠΎΠ΅ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ Π²Π΅Π±-ΠΏΠ°ΠΊΠ΅ΡΠ°
{
test: /\.js?$/,
include: [/node_modules\/signature_pad/],
use: [
{
loader: 'babel-loader'
}
],
}
Π ΠΌΠ½Π΅ ΠΏΡΠΈΡΠ»ΠΎΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΡΠ°ΡΡΠΉ Π·Π°Π³ΡΡΠ·ΡΠΈΠΊ babel Ρ webpack 2
package.json:
"devDependencies": {
....
"babel-core": "^ 5.4.7",
"babel-loader": "^ 5.1.3"
}
Π‘Π°ΠΌΡΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
@ kevinchung1026 ΠΡΠ΅ΡΠ°
ΠΠ°Π΄Π΅ΡΡΡ, ΡΡΠΎ ΡΠ΅Π±Π΅ ΡΠΎΠΆΠ΅ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ π