Вся проблема в том, когда я устанавливаю режим разработки в конфигурации WebPack!
Лог выглядит так:
imgs/screen.png 231 bytes [emitted]
imgs/floor.png 1.74 KiB [emitted]
imgs/wallStock.jpg 77.1 KiB [emitted]
imgs/android-icon.png 16.4 KiB [emitted]
imgs/favicon-96x96.png 7.06 KiB [emitted]
/styles/favicon.ico 1.12 KiB [emitted]
imgs/gcheckmark.png 768 bytes [emitted]
imgs/microphone.png 545 bytes [emitted]
imgs/target.png 25.4 KiB [emitted]
imgs/share-files.png 774 bytes [emitted]
imgs/warning.png 1.3 KiB [emitted]
imgs/webcam.png 398 bytes [emitted]
visualjs2.js 1.84 MiB main [emitted] main
app.html 2.52 KiB [emitted]
/templates/register.html 1.1 KiB [emitted]
/templates/login.html 1.06 KiB [emitted]
[./node_modules/css-loader/index.js!./src/style/styles.css] ./node_modules/css-loader!./src/style/styles.css 9.28 KiB {main} [built]
[./src/app-icon.ts] 641 bytes {main} [built]
[./src/app.ts] 524 bytes {main} [built]
[./src/examples/platformer/platformer.ts] 839 bytes {main} [built]
[./src/examples/platformer/scripts/level1/level1.ts] 5.69 KiB {main} [built]
[./src/icon/permission/webcam.png] 61 bytes {main} [built]
[./src/libs/class/browser.ts] 5.02 KiB {main} [built]
[./src/libs/class/networking/network.ts] 24.9 KiB {main} [built]
[./src/libs/class/view-port.ts] 2.32 KiB {main} [built]
[./src/libs/class/visual-render.ts] 4.15 KiB {main} [built]
[./src/libs/client-config.ts] 2.15 KiB {main} [built]
[./src/libs/ioc.ts] 1.37 KiB {main} [built]
[./src/libs/multiplatform/global-event.ts] 1.48 KiB {main} [built]
[./src/libs/starter.ts] 4.71 KiB {main} [built]
[./src/style/styles.css] 1.06 KiB {main} [built]
Конфигурация веб-пакета:
const CleanWebpackPlugin = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const TypedocWebpackPlugin = require('typedoc-webpack-plugin');
module.exports = {
mode: "development",
watch: true,
entry: "./src/app.ts",
output: {
filename: "visualjs2.js",
path: __dirname + "/build"
},
devtool: "inline-source-map",
resolve: {
extensions: [".js", ".ts", ".tsx", ".json"]
},
module: {
rules: [
{ test: /\.tsx?$/, loader: "ts-loader" },
{
test: /\.(jpg|png)$/, loader: "file-loader", options: {
name: '[name].[ext]',
outputPath: "./imgs"
}
},
{ test: /\.css$/, loader: "style-loader!css-loader" },
{
test: /\.(ico)$/,
use: {
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: '/styles'
}
}
},
// All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
{ enforce: "pre", test: /\.js$/, loader: "source-map-loader" }
]
},
plugins: [
// Make sure that the plugin is after any plugins that add images
new CleanWebpackPlugin(['build'], { /*exclude: ['index.html']*/ }),
new HtmlWebpackPlugin({
filename: 'app.html',
template: 'src/index.html'
}),
new HtmlWebpackPlugin({
filename: '/templates/register.html',
template: 'src/html-components/register.html'
}),
new HtmlWebpackPlugin({
filename: '/templates/login.html',
template: 'src/html-components/login.html'
}),
new ExtractTextPlugin("styles.css")
],
/*
new TypedocWebpackPlugin({
out: './api-doc',
module: 'amd',
target: 'es5',
exclude: '** /node_modules / ** / *.* ',
experimentalDecorators: true,
excludeExternals: true,
name: 'sn-theme',
mode: 'file',
theme: './sn-theme/',
includeDeclarations: false,
ignoreCompilerErrors: true,
})
*/
optimization: {
splitChunks: {
chunks: 'async',
minSize: 30000,
maxSize: 0,
minChunks: 2,
maxAsyncRequests: 5,
maxInitialRequests: 3,
automaticNameDelimiter: '~',
name: true,
cacheGroups: {
vendors: {
test: /[\\/]node_modules[\\/]/,
priority: -10
},
default: {
minChunks: 2,
priority: -20,
reuseExistingChunk: true
}
}
}
}
};
Оптимизация работы. Любой способ только tsconfig.json-> mode: "commonjs" работает.
Почему visualjs2.js 1,84 МБ Основной файл такой большой!
Любое предложение?
режим: производственные результаты:
ПРЕДУПРЕЖДЕНИЕ об ограничении размера актива: следующие активы превышают
рекомендуемый предел размера (244 КиБ). Это может повлиять на производительность сети.
Активы: visualjs2.js (1,52 МиБ)
ПРЕДУПРЕЖДЕНИЕ при ограничении размера точки входа: следующие точки входа объединены
размер актива превышает рекомендуемый лимит (244 КиБ). Это может повлиять
веб-производительность. Entrypoints: основной (1,52 МиБ)
visualjs2.js
ПРЕДУПРЕЖДЕНИЕ в рекомендациях по производительности веб-пакета: Вы можете ограничить размер
ваших пакетов с помощью import () или require.ensure для ленивой загрузки некоторых
части вашего приложения. Для получения дополнительной информации посетите
https://webpack.js.org/guides/code-splitting/
Ошибка после установки режима webpack.config: «производство»
(для многих это не важно, поскольку эта проблема находится в области веб-пакетов):
visualjs2.js: 1 Uncaught TypeError: Невозможно прочитать свойство 'getWidth' из
не определено
на новом e (visualjs2.js: 1)
на e.singlton (visualjs2.js: 1)
на новом e (visualjs2.js: 1)
на объекте. (Visualjs2.js: 1)
на объекте. (Visualjs2.js: 1)
в n (visualjs2.js: 1)
на visualjs2.js: 1
на visualjs2.js: 1
Это мой пакет (зависимость):
"dependencies": {
"@types/matter-js": "^0.10.2",
"express": "^4.16.4",
"matter-attractors": "^0.1.6",
"matter-js": "^0.14.1",
"npm": "^5.8.0",
"tsconfig": "^7.0.0",
"tslint": "^5.9.1",
"websocket": "^1.0.28"
},
"devDependencies": {
"clean-webpack-plugin": "^0.1.19",
"css-loader": "^0.28.11",
"extract-text-webpack-plugin": "^4.0.0-beta.0",
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.2.0",
"source-map-loader": "^0.2.3",
"style-loader": "^0.21.0",
"ts-loader": "^4.4.2",
"typedoc": "^0.13.0",
"typedoc-webpack-plugin": "^1.1.4",
"typescript": "^2.9.2",
"webpack": "^4.25.1",
"webpack-cli": "^3.1.2"
},