Last active
June 30, 2020 12:43
-
-
Save ray007/9303feab03b3ce60979e41a6b3fa9286 to your computer and use it in GitHub Desktop.
webpack bundle / binary corruption problem
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Preparing project... | |
Bundling application for entryPath .\app... | |
Hash: 21815df5bf54b41e1265 | |
Version: webpack 4.27.1 | |
Time: 30055ms | |
Built at: 2020-06-30 14:30:53 | |
Asset Size Chunks Chunk Names | |
assets/splash.gif 17.9 KiB [emitted] | |
bundle.js 7.21 MiB bundle [emitted] bundle | |
fonts/MaterialIcons-Regular.ttf 125 KiB [emitted] | |
fonts/fa-brands-400.ttf 131 KiB [emitted] | |
fonts/fa-regular-400.ttf 39.1 KiB [emitted] | |
fonts/fa-solid-900.ttf 204 KiB [emitted] | |
webassets/css/lweb.ico 2.43 KiB [emitted] | |
webassets/css/lweb.svg 6.09 KiB [emitted] | |
webassets/css/lweb_114.png 12.5 KiB [emitted] | |
webassets/img/lweb900_views.svg 80 KiB [emitted] | |
webassets/img/splash.gif 31.7 KiB [emitted] | |
webassets/index.html 2.26 KiB [emitted] | |
webassets/lib/basket.js 9.9 KiB [emitted] | |
webassets/lib/loader.js 1.94 KiB [emitted] | |
webassets/lib/m/MaterialIcons-Regular.ttf 147 KiB [emitted] | |
webassets/lib/m/material-icons.css 987 bytes [emitted] | |
webassets/lib/m/materialize.css 139 KiB [emitted] | |
webassets/webapp.appcache 924 bytes [emitted] | |
webassets/webapp.js 636 KiB [emitted] | |
webassets/lweblibs.js 393 KiB [emitted] | |
webassets/lwebstyles.css 161 KiB [emitted] | |
webassets/msgs.json 47.8 KiB [emitted] | |
webassets/sw-webapp.js 10.4 KiB [emitted] | |
package.json 112 bytes [emitted] | |
runtime.js 13.9 KiB runtime [emitted] runtime | |
tns-java-classes.js 0 bytes [emitted] | |
vendor.js 14.6 MiB vendor [emitted] vendor | |
Entrypoint bundle = runtime.js vendor.js bundle.js | |
[./ sync ^\.\/app\.(css|scss|less|sass)$] . sync nonrecursive ^\.\/app\.(css|scss|less|sass)$ 175 bytes {bundle} [built] | |
[./ sync recursive (?<!\bApp_Resources\b.*)(?<!\.\/\btests\b\/.*?)\.(xml|css|js|kt|(?<!\.d\.)ts|(?<!\b_[\w-]*\.)scss)$] . sync (?<!\bApp_Resources\b.*)(?<!\.\/\btests\b\/.*?)\.(xml|css|js|kt|(?<!\.d\.)ts|(?<!\b_[\w-]*\.)scss)$ 534 bytes {bundle} [built] | |
[./app.js] 1.84 KiB {bundle} [built] | |
[./app.scss] 120 KiB {bundle} [optional] [built] | |
[./lib/certs.js] 2.8 KiB {bundle} [built] | |
[./lib/loytecBT.js] 4.82 KiB {bundle} [built] | |
[./lib/lwebCfg.js] 3.72 KiB {bundle} [built] | |
[./lib/lwebUrl.js] 2.05 KiB {bundle} [built] | |
[./lib/tnsSrvConn.js] 9.15 KiB {bundle} [built] | |
[./webassets/lib/basket.js] 13.9 KiB {bundle} [optional] [built] | |
[./webassets/lib/loader.js] 2.08 KiB {bundle} [optional] [built] | |
[./webassets/lib/m/material-icons.css] 1.77 KiB {bundle} [optional] [built] | |
[./webassets/lib/m/materialize.css] 140 KiB {bundle} [optional] [built] | |
[./webassets/webapp.js] 638 KiB {bundle} [optional] [built] | |
[./webassets/applibs.js] 540 KiB {bundle} [optional] [built] | |
+ 530 hidden modules | |
Webpack compilation complete. | |
Project successfully prepared (android) | |
Building project... | |
Gradle build... | |
+ setting applicationId | |
+ applying user-defined configuration from C:\rtc-sandbox\ws_rb_lweb\lweb\src\lweb_804\tnsLWeb804\app\App_Resources\Android\app.gradle | |
+ using android X library androidx.legacy:legacy-support-v4:1.0.0 | |
+ adding nativescript runtime package dependency: nativescript-optimized-with-inspector | |
+ adding aar plugin dependency: C:\rtc-sandbox\ws_rb_lweb\lweb\src\lweb_804\tnsLWeb804\node_modules\@nota\nativescript-webview-ext\platforms\android\nativescript_webview_ext.aar | |
+ adding aar plugin dependency: C:\rtc-sandbox\ws_rb_lweb\lweb\src\lweb_804\tnsLWeb804\node_modules\@nota\nativescript-webview-ext\platforms\android\webviewinterface.aar | |
+ adding aar plugin dependency: C:\rtc-sandbox\ws_rb_lweb\lweb\src\lweb_804\tnsLWeb804\node_modules\nativescript-bluetooth\platforms\android\nativescript_bluetooth.aar | |
+ adding aar plugin dependency: C:\rtc-sandbox\ws_rb_lweb\lweb\src\lweb_804\tnsLWeb804\node_modules\nativescript-inappbrowser\platforms\android\nativescript_inappbrowser.aar | |
+ adding aar plugin dependency: C:\rtc-sandbox\ws_rb_lweb\lweb\src\lweb_804\tnsLWeb804\node_modules\tns-core-modules-widgets\platforms\android\widgets-release.aar | |
Project successfully built. | |
The build result is located at: C:\devel\path\to\tnsApp\platforms\android\app\build\outputs\apk\debug\app-debug.apk |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const webpackConfig = require("./webpack.config"); | |
const CopyWebpackPlugin = require("copy-webpack-plugin"); | |
const { findConfigFile } = require("typescript"); | |
module.exports = (env) => { | |
// Here you can modify env before passing them to the default config | |
const config = webpackConfig(env); | |
const copyWebApp = new CopyWebpackPlugin([ | |
{ from: { glob: "webassets/**/*" } }, | |
]); | |
config.plugins.push(copyWebApp); | |
return config; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const { join, relative, resolve, sep } = require("path"); | |
const webpack = require("webpack"); | |
const CleanWebpackPlugin = require("clean-webpack-plugin"); | |
const CopyWebpackPlugin = require("copy-webpack-plugin"); | |
const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer"); | |
const TerserPlugin = require("terser-webpack-plugin"); | |
const VueLoaderPlugin = require('vue-loader/lib/plugin'); | |
const NsVueTemplateCompiler = require("nativescript-vue-template-compiler"); | |
const nsWebpack = require("nativescript-dev-webpack"); | |
const nativescriptTarget = require("nativescript-dev-webpack/nativescript-target"); | |
const { NativeScriptWorkerPlugin } = require("nativescript-worker-loader/NativeScriptWorkerPlugin"); | |
const hashSalt = Date.now().toString(); | |
module.exports = env => { | |
// Add your custom Activities, Services and other android app components here. | |
const appComponents = env.appComponents || []; | |
appComponents.push(...[ | |
"tns-core-modules/ui/frame", | |
"tns-core-modules/ui/frame/activity", | |
]); | |
const platform = env && (env.android && "android" || env.ios && "ios" || env.platform); | |
if (!platform) { | |
throw new Error("You need to provide a target platform!"); | |
} | |
const platforms = ["ios", "android"]; | |
const projectRoot = __dirname; | |
if (env.platform) { | |
platforms.push(env.platform); | |
} | |
// Default destination inside platforms/<platform>/... | |
const dist = resolve(projectRoot, nsWebpack.getAppPath(platform, projectRoot)); | |
const { | |
// The 'appPath' and 'appResourcesPath' values are fetched from | |
// the nsconfig.json configuration file. | |
appPath = "app", | |
appResourcesPath = "app/App_Resources", | |
// You can provide the following flags when running 'tns run android|ios' | |
snapshot, // --env.snapshot | |
production, // --env.production | |
report, // --env.report | |
hmr, // --env.hmr | |
sourceMap, // --env.sourceMap | |
hiddenSourceMap, // --env.hiddenSourceMap | |
unitTesting, // --env.unitTesting | |
verbose, // --env.verbose | |
snapshotInDocker, // --env.snapshotInDocker | |
skipSnapshotTools, // --env.skipSnapshotTools | |
compileSnapshot // --env.compileSnapshot | |
} = env; | |
const useLibs = compileSnapshot; | |
const isAnySourceMapEnabled = !!sourceMap || !!hiddenSourceMap; | |
const externals = nsWebpack.getConvertedExternals(env.externals); | |
const mode = production ? "production" : "development" | |
const appFullPath = resolve(projectRoot, appPath); | |
const hasRootLevelScopedModules = nsWebpack.hasRootLevelScopedModules({ projectDir: projectRoot }); | |
let coreModulesPackageName = "tns-core-modules"; | |
const alias = env.alias || {}; | |
alias['~'] = appFullPath; | |
alias['@'] = appFullPath; | |
alias['vue'] = 'nativescript-vue'; | |
if (hasRootLevelScopedModules) { | |
coreModulesPackageName = "@nativescript/core"; | |
alias["tns-core-modules"] = coreModulesPackageName; | |
} | |
const appResourcesFullPath = resolve(projectRoot, appResourcesPath); | |
const entryModule = nsWebpack.getEntryModule(appFullPath, platform); | |
const entryPath = `.${sep}${entryModule}`; | |
const entries = env.entries || {}; | |
entries.bundle = entryPath; | |
const areCoreModulesExternal = Array.isArray(env.externals) && env.externals.some(e => e.indexOf("tns-core-modules") > -1); | |
if (platform === "ios" && !areCoreModulesExternal) { | |
entries["tns_modules/tns-core-modules/inspector_modules"] = "inspector_modules"; | |
}; | |
console.log(`Bundling application for entryPath ${entryPath}...`); | |
let sourceMapFilename = nsWebpack.getSourceMapFilename(hiddenSourceMap, __dirname, dist); | |
const itemsToClean = [`${dist}/**/*`]; | |
if (platform === "android") { | |
itemsToClean.push(`${join(projectRoot, "platforms", "android", "app", "src", "main", "assets", "snapshots")}`); | |
itemsToClean.push(`${join(projectRoot, "platforms", "android", "app", "build", "configurations", "nativescript-android-snapshot")}`); | |
} | |
nsWebpack.processAppComponents(appComponents, platform); | |
const config = { | |
mode: mode, | |
context: appFullPath, | |
externals, | |
watchOptions: { | |
ignored: [ | |
appResourcesFullPath, | |
// Don't watch hidden files | |
"**/.*", | |
], | |
}, | |
target: nativescriptTarget, | |
// target: nativeScriptVueTarget, | |
entry: entries, | |
output: { | |
pathinfo: false, | |
path: dist, | |
sourceMapFilename, | |
libraryTarget: "commonjs2", | |
filename: "[name].js", | |
globalObject: "global", | |
hashSalt | |
}, | |
resolve: { | |
extensions: [".vue", ".ts", ".js", ".scss", ".css"], | |
// Resolve {N} system modules from tns-core-modules | |
modules: [ | |
resolve(__dirname, `node_modules/${coreModulesPackageName}`), | |
resolve(__dirname, "node_modules"), | |
`node_modules/${coreModulesPackageName}`, | |
"node_modules", | |
], | |
alias, | |
// resolve symlinks to symlinked modules | |
symlinks: true, | |
}, | |
resolveLoader: { | |
// don't resolve symlinks to symlinked loaders | |
symlinks: false, | |
}, | |
node: { | |
// Disable node shims that conflict with NativeScript | |
"http": false, | |
"timers": false, | |
"setImmediate": false, | |
"fs": "empty", | |
"__dirname": false, | |
}, | |
devtool: hiddenSourceMap ? "hidden-source-map" : (sourceMap ? "inline-source-map" : "none"), | |
optimization: { | |
runtimeChunk: "single", | |
noEmitOnErrors: true, | |
splitChunks: { | |
cacheGroups: { | |
vendor: { | |
name: "vendor", | |
chunks: "all", | |
test: (module) => { | |
const moduleName = module.nameForCondition ? module.nameForCondition() : ''; | |
return /[\\/]node_modules[\\/]/.test(moduleName) || | |
appComponents.some(comp => comp === moduleName); | |
}, | |
enforce: true, | |
}, | |
}, | |
}, | |
minimize: Boolean(production), | |
minimizer: [ | |
new TerserPlugin({ | |
parallel: true, | |
cache: true, | |
sourceMap: isAnySourceMapEnabled, | |
terserOptions: { | |
output: { | |
comments: false, | |
semicolons: !isAnySourceMapEnabled | |
}, | |
compress: { | |
// The Android SBG has problems parsing the output | |
// when these options are enabled | |
'collapse_vars': platform !== "android", | |
sequences: platform !== "android", | |
}, | |
keep_fnames: true, | |
}, | |
}), | |
], | |
}, | |
module: { | |
rules: [{ | |
include: [join(appFullPath, entryPath + ".js"), join(appFullPath, entryPath + ".ts")], | |
use: [ | |
// Require all Android app components | |
platform === "android" && { | |
loader: "nativescript-dev-webpack/android-app-components-loader", | |
options: { modules: appComponents }, | |
}, | |
{ | |
loader: "nativescript-dev-webpack/bundle-config-loader", | |
options: { | |
registerPages: true, // applicable only for non-angular apps | |
loadCss: !snapshot, // load the application css if in debug mode | |
unitTesting, | |
appFullPath, | |
projectRoot, | |
ignoredFiles: nsWebpack.getUserDefinedEntries(entries, platform) | |
}, | |
}, | |
].filter(loader => Boolean(loader)), | |
}, | |
{ | |
test: /[\/|\\]app\.css$/, | |
use: [ | |
'nativescript-dev-webpack/style-hot-loader', | |
{ | |
loader: "nativescript-dev-webpack/css2json-loader", | |
options: { useForImports: true } | |
}, | |
], | |
}, | |
{ | |
test: /[\/|\\]app\.scss$/, | |
use: [ | |
'nativescript-dev-webpack/style-hot-loader', | |
{ | |
loader: "nativescript-dev-webpack/css2json-loader", | |
options: { useForImports: true } | |
}, | |
'sass-loader', | |
], | |
}, | |
{ | |
test: /\.css$/, | |
exclude: /[\/|\\]app\.css$/, | |
use: [ | |
'nativescript-dev-webpack/style-hot-loader', | |
'nativescript-dev-webpack/apply-css-loader.js', | |
{ loader: "css-loader", options: { url: false } }, | |
], | |
}, | |
{ | |
test: /\.scss$/, | |
exclude: /[\/|\\]app\.scss$/, | |
use: [ | |
'nativescript-dev-webpack/style-hot-loader', | |
'nativescript-dev-webpack/apply-css-loader.js', | |
{ loader: "css-loader", options: { url: false } }, | |
'sass-loader', | |
], | |
}, | |
{ | |
test: /\.js$/, | |
loader: 'babel-loader', | |
}, | |
{ | |
test: /\.ts$/, | |
loader: 'ts-loader', | |
options: { | |
appendTsSuffixTo: [/\.vue$/], | |
allowTsInNodeModules: true, | |
compilerOptions: { | |
declaration: false | |
} | |
}, | |
}, | |
{ | |
test: /\.vue$/, | |
loader: "vue-loader", | |
options: { | |
compiler: NsVueTemplateCompiler, | |
}, | |
}, | |
], | |
}, | |
plugins: [ | |
// ... Vue Loader plugin omitted | |
// make sure to include the plugin! | |
new VueLoaderPlugin(), | |
// Define useful constants like TNS_WEBPACK | |
new webpack.DefinePlugin({ | |
"global.TNS_WEBPACK": "true", | |
"TNS_ENV": JSON.stringify(mode), | |
"process": "global.process" | |
}), | |
// Remove all files from the out dir. | |
new CleanWebpackPlugin(itemsToClean, { verbose: !!verbose }), | |
// Copy assets to out dir. Add your own globs as needed. | |
new CopyWebpackPlugin([ | |
{ from: { glob: "fonts/**" } }, | |
{ from: { glob: "**/*.+(jpg|png)" } }, | |
{ from: { glob: "assets/**/*" } }, | |
], { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] }), | |
new nsWebpack.GenerateNativeScriptEntryPointsPlugin("bundle"), | |
// For instructions on how to set up workers with webpack | |
// check out https://github.com/nativescript/worker-loader | |
new NativeScriptWorkerPlugin(), | |
new nsWebpack.PlatformFSPlugin({ | |
platform, | |
platforms, | |
}), | |
// Does IPC communication with the {N} CLI to notify events when running in watch mode. | |
new nsWebpack.WatchStateLoggerPlugin() | |
], | |
}; | |
if (unitTesting) { | |
config.module.rules.push( | |
{ | |
test: /-page\.js$/, | |
use: "nativescript-dev-webpack/script-hot-loader" | |
}, | |
{ | |
test: /\.(html|xml)$/, | |
use: "nativescript-dev-webpack/markup-hot-loader" | |
}, | |
{ test: /\.(html|xml)$/, use: "nativescript-dev-webpack/xml-namespace-loader" } | |
); | |
} | |
if (report) { | |
// Generate report files for bundles content | |
config.plugins.push(new BundleAnalyzerPlugin({ | |
analyzerMode: "static", | |
openAnalyzer: false, | |
generateStatsFile: true, | |
reportFilename: resolve(projectRoot, "report", `report.html`), | |
statsFilename: resolve(projectRoot, "report", `stats.json`), | |
})); | |
} | |
if (snapshot) { | |
config.plugins.push(new nsWebpack.NativeScriptSnapshotPlugin({ | |
chunk: "vendor", | |
requireModules: [ | |
"tns-core-modules/bundle-entry-points", | |
], | |
projectRoot, | |
webpackConfig: config, | |
snapshotInDocker, | |
skipSnapshotTools, | |
useLibs | |
})); | |
} | |
if (hmr) { | |
config.plugins.push(new webpack.HotModuleReplacementPlugin()); | |
} | |
return config; | |
}; | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment