ptl-miguel
commented
3 years ago do you mind dropping your webpack config here
Open wontroba666 opened 4 years ago
ptl-miguel
commented
3 years ago do you mind dropping your webpack config here
setinais
commented
3 years ago I have the same problem
The webpack: const { join, relative, resolve, sep, dirname } = require('path'); const fs = require('fs');
const webpack = require('webpack'); const nsWebpack = require('@nativescript/webpack'); const nativescriptTarget = require('@nativescript/webpack/nativescript-target'); const { nsSupportHmrNg } = require('@nativescript/webpack/transformers/ns-support-hmr-ng'); const { nsTransformNativeClassesNg } = require("@nativescript/webpack/transformers/ns-transform-native-classes-ng"); const { parseWorkspaceConfig, hasConfigurations } = require('@nativescript/webpack/helpers/angular-config-parser'); const { getMainModulePath } = require('@nativescript/webpack/utils/ast-utils'); const { getNoEmitOnErrorFromTSConfig, getCompilerOptionsFromTSConfig } = require("@nativescript/webpack/utils/tsconfig-utils"); const { CleanWebpackPlugin } = require('clean-webpack-plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer'); const { NativeScriptWorkerPlugin } = require('nativescript-worker-loader/NativeScriptWorkerPlugin'); const TerserPlugin = require('terser-webpack-plugin'); const { getAngularCompilerPlugin } = require('@nativescript/webpack/plugins/NativeScriptAngularCompilerPlugin'); const hashSalt = Date.now().toString();
module.exports = env => { // Add your custom Activities, Services and other Android app components here. const appComponents = [ "@nativescript/core/ui/frame", "@nativescript/core/ui/frame/activity" ];
const platform = env && ((env.android && 'android') || (env.ios && 'ios')); if (!platform) { throw new Error('You need to provide a target platform!'); }
const AngularCompilerPlugin = getAngularCompilerPlugin(platform); const projectRoot = __dirname;
// Default destination inside platforms/
const {
// The 'appPath' and 'appResourcesPath' values are fetched from
// the nsconfig.json configuration file
// when bundling with tns run android|ios --bundle.
appPath = 'src',
appResourcesPath = 'App_Resources',
// You can provide the following flags when running 'tns run android|ios'
snapshot, // --env.snapshot,
production, // --env.production
configuration, // --env.configuration (consistent with angular cli usage)
projectName, // --env.projectName (drive configuration through angular projects)
uglify, // --env.uglify
report, // --env.report
sourceMap, // --env.sourceMap
hiddenSourceMap, // --env.hiddenSourceMap
hmr, // --env.hmr,
unitTesting, // --env.unitTesting
testing, // --env.testing
verbose, // --env.verbose
ci, // --env.ci
snapshotInDocker, // --env.snapshotInDocker
skipSnapshotTools, // --env.skipSnapshotTools
compileSnapshot // --env.compileSnapshot} = env;
const { fileReplacements, copyReplacements } = parseWorkspaceConfig(platform, configuration, projectName);
const useLibs = compileSnapshot;
const isAnySourceMapEnabled = !!sourceMap || !!hiddenSourceMap;
const externals = nsWebpack.getConvertedExternals(env.externals);
const appFullPath = resolve(projectRoot, appPath);
const appResourcesFullPath = resolve(projectRoot, appResourcesPath);
let tsConfigName = 'tsconfig.json';
let tsConfigPath = resolve(projectRoot, tsConfigName);
const tsConfigTnsName = 'tsconfig.tns.json';
const tsConfigTnsPath = resolve(projectRoot, tsConfigTnsName);
if (fs.existsSync(tsConfigTnsPath)) {
// support shared angular app configurations
tsConfigName = tsConfigTnsName;
tsConfigPath = tsConfigTnsPath;
}
const tsConfigEnvName = 'tsconfig.env.json';
const tsConfigEnvPath = resolve(projectRoot, tsConfigEnvName);
if (hasConfigurations(configuration) && fs.existsSync(tsConfigEnvPath)) {
// when configurations are used, switch to environments supported config
tsConfigName = tsConfigEnvName;
tsConfigPath = tsConfigEnvPath;
}
const entryModule = ${nsWebpack.getEntryModule(appFullPath, platform)}.ts;
const entryPath = .${sep}${entryModule};
const entries = { bundle: entryPath };
const areCoreModulesExternal =
Array.isArray(env.externals) &&
env.externals.some(e => e.indexOf('@nativescript') > -1);
if (platform === 'ios' && !areCoreModulesExternal && !testing) {
entries['tns_modules/@nativescript/core/inspector_modules'] =
'inspector_modules';
}
const compilerOptions = getCompilerOptionsFromTSConfig(tsConfigPath); nsWebpack.processTsPathsForScopedModules({ compilerOptions }); nsWebpack.processTsPathsForScopedAngular({ compilerOptions });
const ngCompilerTransformers = [nsTransformNativeClassesNg]; const additionalLazyModuleResources = [];
const copyIgnore = { ignore: [${relative(appPath, appResourcesFullPath)}/**] };
const copyTargets = [
{ from: 'assets/', noErrorOnMissing: true, globOptions: { dot: false, ...copyIgnore } },
{ from: 'fonts/', noErrorOnMissing: true, globOptions: { dot: false, ...copyIgnore } },
...copyReplacements
];
if (!production) { // for development purposes only // for example, include mock json folder // copyTargets.push({ from: 'tools/mockdata', to: 'assets/mockdata' });
if (hmr) {
ngCompilerTransformers.push(nsSupportHmrNg);
}}
// when "@angular/core" is external, it's not included in the bundles. In this way, it will be used // directly from node_modules and the Angular modules loader won't be able to resolve the lazy routes // fixes https://github.com/NativeScript/nativescript-cli/issues/4024 if (env.externals && env.externals.indexOf('@angular/core') > -1) { const appModuleRelativePath = getMainModulePath( resolve(appFullPath, entryModule), tsConfigName ); if (appModuleRelativePath) { const appModuleFolderPath = dirname( resolve(appFullPath, appModuleRelativePath) ); // include the new lazy loader path in the allowed ones additionalLazyModuleResources.push(appModuleFolderPath); } }
const ngCompilerPlugin = new AngularCompilerPlugin({ hostReplacementPaths: nsWebpack.getResolver([platform, 'tns']), platformTransformers: ngCompilerTransformers.map(t => t(() => ngCompilerPlugin, resolve(appFullPath, entryModule), projectRoot) ), mainPath: join(appFullPath, entryModule), tsConfigPath, skipCodeGeneration: false, sourceMap: !!isAnySourceMapEnabled, additionalLazyModuleResources: additionalLazyModuleResources, compilerOptions: { paths: compilerOptions.paths } });
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' )}
);
}
const noEmitOnErrorFromTSConfig = getNoEmitOnErrorFromTSConfig(tsConfigName);
nsWebpack.processAppComponents(appComponents, platform); const config = { mode: production ? 'production' : 'development', context: appFullPath, externals, watchOptions: { ignored: [ appResourcesFullPath, // Don't watch hidden files '*/.' ] }, target: nativescriptTarget, entry: entries, output: { pathinfo: false, path: dist, sourceMapFilename, libraryTarget: 'commonjs2', filename: '[name].js', globalObject: 'global', hashSalt }, resolve: { extensions: ['.ts', '.js', '.scss', '.css'], // Resolve {N} system modules from @nativescript/core modules: [ resolve(dirname, 'node_modules/@nativescript/core'), resolve(__dirname, 'node_modules'), 'node_modules/@nativescript/core', 'node_modules' ], alias: { '~/package.json': resolve(projectRoot, 'package.json'), '~': appFullPath, "tns-core-modules": "@nativescript/core", "nativescript-angular": "@nativescript/angular", ...fileReplacements }, symlinks: true }, resolveLoader: { 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: noEmitOnErrorFromTSConfig, splitChunks: { cacheGroups: { vendor: { name: 'vendor', chunks: 'all', test: (module, chunks) => { const moduleName = module.nameForCondition ? module.nameForCondition() : ''; return ( /[\/]node_modules[\/]/.test(moduleName) || appComponents.some(comp => comp === moduleName) ); }, enforce: true } } }, minimize: !!uglify, minimizer: [ new TerserPlugin({ parallel: true, cache: !ci, 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', // custom drop_console: true, drop_debugger: true, ecma: 6, keep_infinity: platform === 'android', // for Chrome/V8 reduce_funcs: platform !== 'android', // for Chrome/V8 global_defs: { UGLIFIED: true } }, // custom ecma: 6, safari10: platform !== 'android' } }) ] }, module: { rules: [ { include: join(appFullPath, entryPath), use: [ // Require all Android app components platform === 'android' && { loader: '@nativescript/webpack/helpers/android-app-components-loader', options: { modules: appComponents } },
{
loader: '@nativescript/webpack/bundle-config-loader',
options: {
angular: true,
loadCss: !snapshot, // load the application css if in debug mode
unitTesting,
appFullPath,
projectRoot,
ignoredFiles: nsWebpack.getUserDefinedEntries(entries, platform)
}
}
].filter(loader => !!loader)
},
{ test: /\.html$|\.xml$/, use: 'raw-loader' },
{
test: /[\/|\\]app\.css$/,
use: [
'@nativescript/webpack/helpers/style-hot-loader',
{
loader: "@nativescript/webpack/helpers/css2json-loader",
options: { useForImports: true }
},
],
},
{
test: /[\/|\\]app\.scss$/,
use: [
'@nativescript/webpack/helpers/style-hot-loader',
{
loader: "@nativescript/webpack/helpers/css2json-loader",
options: { useForImports: true }
},
'sass-loader',
],
},
// Angular components reference css files and their imports using raw-loader
{ test: /\.css$/, exclude: /[\/|\\]app\.css$/, use: 'raw-loader' },
{
test: /\.scss$/,
exclude: /[\/|\\]app\.scss$/,
use: ['raw-loader', 'resolve-url-loader', 'sass-loader']
},
{
test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
use: [
'@nativescript/webpack/helpers/moduleid-compat-loader',
'@nativescript/webpack/helpers/lazy-ngmodule-hot-loader',
'@ngtools/webpack'
]
},
// Mark files inside `@angular/core` as using SystemJS style dynamic imports.
// Removing this will cause deprecation warnings to appear.
{
test: /[\/\\]@angular[\/\\]core[\/\\].+\.js$/,
parser: { system: true }
}
]
},
plugins: [
// Define useful constants like TNS_WEBPACK
new webpack.DefinePlugin({
'global.TNS_WEBPACK': 'true',
'global.isAndroid': platform === 'android',
'global.isIOS': platform === 'ios',
process: 'global.process'
}),
// Remove all files from the out dir.
new CleanWebpackPlugin({
cleanOnceBeforeBuildPatterns: itemsToClean,
verbose: !!verbose
}),
// Copy assets
new CopyWebpackPlugin({
patterns: copyTargets,
}),
new nsWebpack.GenerateNativeScriptEntryPointsPlugin('bundle'),
// For instructions on how to set up workers with webpack
// check out https://github.com/nativescript/worker-loader
new NativeScriptWorkerPlugin(),
ngCompilerPlugin,
// Does IPC communication with the {N} CLI to notify events when running in watch mode.
new nsWebpack.WatchStateLoggerPlugin()
]};
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', angular: true, requireModules: [ 'reflect-metadata', '@angular/platform-browser', '@angular/core', '@angular/common', '@angular/router', '@nativescript/angular' ], projectRoot, webpackConfig: config, snapshotInDocker, skipSnapshotTools, useLibs }) ); }
if (!production && hmr) { config.plugins.push(new webpack.HotModuleReplacementPlugin()); }
return config; };
hello i have problem with plugin when i try to check app with tns preview i have this error
could anyone help?
LOG from device Redmi: ERROR TypeError: Cannot read property 'model' of undefined LOG from device Redmi: "nodeFlags": 1, LOG from device Redmi: "def": { LOG from device Redmi: "rootNodeFlags": 1, LOG from device Redmi: "view": { LOG from device Redmi: ERROR CONTEXT { LOG from device Redmi: "flags": 0, LOG from device Redmi: "nodes": [ LOG from device Redmi: "nodeIndex": 0, LOG from device Redmi: { LOG from device Redmi: "nodeMatchedQueries": 0, LOG from device Redmi: "parent": null, LOG from device Redmi: "outputIndex": 0, LOG from device Redmi: "renderParent": null, LOG from device Redmi: "checkIndex": 0, LOG from device Redmi: "bindingIndex": 0, LOG from device Redmi: "directChildFlags": 0, LOG from device Redmi: "childFlags": 0, LOG from device Redmi: "flags": 1, LOG from device Redmi: "childMatchedQueries": 0, LOG from device Redmi: "matchedQueries": {}, LOG from device Redmi: "references": { LOG from device Redmi: "matchedQueryIds": 0, LOG from device Redmi: "mapView": 1 LOG from device Redmi: "ngContentIndex": null, LOG from device Redmi: }, LOG from device Redmi: { LOG from device Redmi: "childCount": 0, LOG from device Redmi: "bindings": [ LOG from device Redmi: "ns": "", LOG from device Redmi: "flags": 8, LOG from device Redmi: "name": "latitude", LOG from device Redmi: "securityContext": 0 LOG from device Redmi: "nonMinifiedName": "latitude", LOG from device Redmi: { LOG from device Redmi: }, LOG from device Redmi: "flags": 8, LOG from device Redmi: "ns": "", LOG from device Redmi: "name": "longitude", LOG from device Redmi: "nonMinifiedName": "longitude", LOG from device Redmi: "securit... LOG from device Redmi: ERROR TypeError: Cannot read property 'model' of undefined LOG from device Redmi: ERROR CONTEXT { LOG from device Redmi: "def": { LOG from device Redmi: "rootNodeFlags": 1, LOG from device Redmi: "nodeFlags": 1, LOG from device Redmi: "view": { LOG from device Redmi: "nodes": [ LOG from device Redmi: "flags": 0, LOG from device Redmi: "nodeMatchedQueries": 0, LOG from device Redmi: { LOG from device Redmi: "nodeIndex": 0, LOG from device Redmi: "parent": null, LOG from device Redmi: "renderParent": null, LOG from device Redmi: "bindingIndex": 0, LOG from device Redmi: "checkIndex": 0, LOG from device Redmi: "outputIndex": 0, LOG from device Redmi: "flags": 1, LOG from device Redmi: "directChildFlags": 0, LOG from device Redmi: "childFlags": 0, LOG from device Redmi: "matchedQueries": {}, LOG from device Redmi: "childMatchedQueries": 0, LOG from device Redmi: "matchedQueryIds": 0, LOG from device Redmi: "mapView": 1 LOG from device Redmi: "references": { LOG from device Redmi: }, LOG from device Redmi: "ngContentIndex": null, LOG from device Redmi: "childCount": 0, LOG from device Redmi: "bindings": [ LOG from device Redmi: { LOG from device Redmi: "flags": 8, LOG from device Redmi: "ns": "", LOG from device Redmi: "name": "latitude", LOG from device Redmi: "securityContext": 0 LOG from device Redmi: "nonMinifiedName": "latitude", LOG from device Redmi: { LOG from device Redmi: }, LOG from device Redmi: "flags": 8, LOG from device Redmi: "securit... LOG from device Redmi: "ns": "", LOG from device Redmi: "name": "longitude", LOG from device Redmi: "nonMinifiedName": "longitude", LOG from device Redmi: ERROR TypeError: Cannot read property 'model' of undefined LOG from device Redmi: ERROR CONTEXT { LOG from device Redmi: "view": { LOG from device Redmi: "def": { LOG from device Redmi: "nodeFlags": 1, LOG from device Redmi: An uncaught Exception occurred on "main" thread. Calling js method onCreateView failed TypeError: Cannot read property 'model' of undefined
StackTrace: push.../node_modules/nativescript-google-maps-sdk/map-view.js.MapView._createCameraPosition(file:///data/data/org.nativescript.preview/files/app/vendor.js:44035:57) at push.../node_modules/nativescript-google-maps-sdk/map-view.js.MapView.createNativeView(file:///data/data/org.nativescript.preview/files/app/vendor.js:43825:35) at ViewBase._setupUI(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:511:31) at (file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:553:19) at LayoutBaseCommon.eachChildView(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/layouts/layout-base-common.js:125:26) at ViewCommon.eachChild(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view/view-common.js:925:14) at ViewBase._setupUI(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:552:14) at (file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:553:19) at LayoutBaseCommon.eachChildView(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/layouts/layout-base-common.js:125:26) at ViewCommon.eachChild(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view/view-common.js:925:14) at ViewBase._setupUI(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:552:14) at (file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:553:19) at ContentView.eachChildView(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/content-view/content-view.js:70:13) at PageBase.eachChildView(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/page/page-common.js:126:40) at ViewCommon.eachChild(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view/view-common.js:925:14) at ViewBase._setupUI(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:552:14) at ViewBase._addViewCore(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:448:18) at ViewBase._addView(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/core/view-base/view-base.js:437:14) at FragmentCallbacksImplementation.onCreateView(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/frame/frame.js:700:19) at FragmentClass.onCreateView(file:///data/data/org.nativescript.preview/files/app/tns_modules/@nativescript/core/ui/frame/fragment.js:29:38) at com.tns.Runtime.callJSMethodNative(Native Method) at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1286) at com.tns.Runtime.callJSMethodImpl(Runtime.java:1173) at com.tns.Runtime.callJSMethod(Runtime.java:1160) at com.tns.Runtime.callJSMethod(Runtime.java:1138) at com.tns.Runtime.callJSMethod(Runtime.java:1134) at com.tns.FragmentClass.onCreateView(FragmentClass.java:54) at androidx.fragment.app.Fragment.performCreateView(Fragment.java:2439) at androidx.fragment.app.FragmentManagerImpl.moveToState(FragmentManager.java:1460) at androidx.fragment.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManager.java:1784) at androidx.fragment.app.FragmentManagerImpl.moveToState(FragmentManager.java:1852) at androidx.fragment.app.BackStackRecord.executeOps(BackStackRecord.java:802) at androidx.fragment.app.FragmentManagerImpl.executeOps(FragmentManager.java:2625) at androidx.fragment.app.FragmentManagerImpl.executeOpsTogether(FragmentManager.java:2411) at androidx.fragment.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManager.java:2366) at androidx.fragment.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:2273) at androidx.fragment.app.FragmentManagerImpl$1.run(FragmentManager.java:733) at android.os.Handler.handleCallback(Handler.java:883) at android.os.Handler.dispatchMessage(Handler.java:100) at android.os.Looper.loop(Looper.java:224) at android.app.ActivityThread.main(ActivityThread.java:7509) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:539) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:995)