Constant file change detected when using a symlink plugin in an nativescript-vue app

[VladimirAmiorkov]

Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):

• CLI: 5.2.0

• Cross-platform modules: ~5.2.0

• nativescript-vue: ~2.0.0

• Android Runtime: 5.2.1

• iOS Runtime: 5.2.0

• Plugin(s):

• Node.js: 10.13.0

• Please, attach your package.json and webpack.config.js as these configurations are usually critical for investigating issues with webpack

package.json:

{
    "nativescript": {
        "id": "org.nativescript.picker.demovue",
        "tns-android": {
            "version": "5.2.1"
        },
        "tns-ios": {
            "version": "5.2.0"
        }
    },
    "description": "NativeScript PickerField Demo Vue",
    "scripts": {
        "run.ios": "tns run ios --syncAllFiles --provision NativeScriptDevProfile --bundle",
        "run.android": "tns run android --syncAllFiles --provision NativeScriptDevProfile --bundle",
        "build.plugin": "cd ../src && npm run build",
        "ci.tslint": "npm i && tslint --config '../tslint.json' 'src/**/*.ts'"
    },
    "dependencies": {
        "nativescript-picker": "file:../src",
        "nativescript-theme-core": "~1.0.4",
        "nativescript-vue": "~2.0.0",
        "tns-core-modules": "~5.2.0"
    },
    "devDependencies": {
        "@babel/core": "~7.2.0",
        "@babel/preset-env": "~7.2.0",
        "babel-loader": "~8.0.0",
        "nativescript-dev-typescript": "~0.8.0",
        "nativescript-dev-webpack": "~0.20.0",
        "nativescript-vue-template-compiler": "~2.0.2",
        "node-sass": "~4.9.0",
        "vue-loader": "~15.4.0"
    },
    "readme": "NativeScript PickerField Demo Vue"
}

webpack.config.js:

const { 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 UglifyJsPlugin = require("uglifyjs-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");

module.exports = env => {
    // Add your custom Activities, Services and other android app components here.
    const appComponents = [
        "tns-core-modules/ui/frame",
        "tns-core-modules/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 platforms = ["ios", "android"];
    const projectRoot = __dirname;

    // Default destination inside platforms/<platform>/...
    const dist = resolve(projectRoot, nsWebpack.getAppPath(platform, projectRoot));
    const appResourcesPlatformDir = platform === "android" ? "Android" : "iOS";

    const {
        // The 'appPath' and 'appResourcesPath' values are fetched from
        // the nsconfig.json configuration file
        // when bundling with `tns run android|ios --bundle`.
        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
    } = env;

    const externals = nsWebpack.getConvertedExternals(env.externals);

    const mode = production ? "production" : "development"

    const appFullPath = resolve(projectRoot, appPath);
    const appResourcesFullPath = resolve(projectRoot, appResourcesPath);

    const entryModule = nsWebpack.getEntryModule(appFullPath);
    const entryPath = `.${sep}${entryModule}`;
    console.log(`Bundling application for entryPath ${entryPath}...`);

    const config = {
        mode: mode,
        context: appFullPath,
        externals,
        watchOptions: {
            ignored: [
                appResourcesFullPath,
                // Don't watch hidden files
                "**/.*",
            ],
        },
        target: nativescriptTarget,
        // target: nativeScriptVueTarget,
        entry: {
            bundle: entryPath,
        },
        output: {
            pathinfo: false,
            path: dist,
            libraryTarget: "commonjs2",
            filename: "[name].js",
            globalObject: "global",
        },
        resolve: {
            extensions: [".vue", ".ts", ".js", ".scss", ".css"],
            // Resolve {N} system modules from tns-core-modules
            modules: [
                resolve(__dirname, "node_modules/tns-core-modules"),
                resolve(__dirname, "node_modules"),
                "node_modules/tns-core-modules",
                "node_modules",
            ],
            alias: {
                '~': appFullPath,
                '@': appFullPath,
                'vue': 'nativescript-vue'
            },
            // 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: "none",
        optimization: {
            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 UglifyJsPlugin({
                    parallel: true,
                    cache: true,
                    uglifyOptions: {
                        output: {
                            comments: false,
                        },
                        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: [{
                    test: new RegExp(entryPath + ".(js|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
                            },
                        },
                    ].filter(loader => Boolean(loader)),
                },
                {
                    test: /\.css$/,
                    use: [
                        'nativescript-dev-webpack/style-hot-loader',
                        'nativescript-dev-webpack/apply-css-loader.js',
                        { loader: "css-loader", options: { minimize: false, url: false } },
                    ],
                },
                {
                    test: /\.scss$/,
                    use: [
                        'nativescript-dev-webpack/style-hot-loader',
                        'nativescript-dev-webpack/apply-css-loader.js',
                        { loader: "css-loader", options: { minimize: false, url: false } },
                        "sass-loader",
                    ],
                },
                {
                    test: /\.js$/,
                    loader: 'babel-loader',
                },
                {
                    test: /\.ts$/,
                    loader: 'ts-loader',
                    options: {
                        appendTsSuffixTo: [/\.vue$/],
                        allowTsInNodeModules: true,
                    },
                },
                {
                    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)
            }),
            // Remove all files from the out dir.
            new CleanWebpackPlugin([`${dist}/**/*`]),
            // Copy native app resources to out dir.
            new CopyWebpackPlugin([{
                from: `${appResourcesFullPath}/${appResourcesPlatformDir}`,
                to: `${dist}/App_Resources/${appResourcesPlatformDir}`,
                context: projectRoot,
            }]),
            // 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)}/**`] }),
            // Generate a bundle starter script and activate it in package.json
            new nsWebpack.GenerateBundleStarterPlugin([
                "./vendor",
                "./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 (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,
        }));
    }

    if (hmr) {
        config.plugins.push(new webpack.HotModuleReplacementPlugin());
    }

    return config;
};

tsconfig.json:

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "noEmitHelpers": true,
        "noEmitOnError": true,
        "lib": [
            "es6",
            "dom"
        ],
        "baseUrl": ".",
        "paths": {
            "~/*": [
                "app/*"
            ],
            "*": [
                "./node_modules/tns-core-modules/*",
                "./node_modules/*"
            ]
        }
    },
    "include": [
        "../src",
        "**/*"
    ],
    "exclude": [
        "../src/node_modules",
        "node_modules",
        "platforms"
    ],
}

Describe the bug
When developing an plugin it is common to symlink your plugin in a test application rather than use a archived tgz file. When such symlink plugin is used inside a NativeScript + VueJs application and the "--bundle" flag is passed to tns run a constant rebuild if the project is triggered. The plugin that is used with symlink has a tsconfig.json file with "declaration": true, this is critical in reproducing the issue.

To Reproduce

• Clone nativescript-picker
• Go to the src directory and run npm run build to build the plugin's code
• Go to its demo-vue directory and run tns run ios --bundle or tns run android --bundle

Expected behavior
After the above steps the demo-vue application is deployed correctly to the device/simulator

Sample project
Can be found here.

Additional context
CLI output:

mcsofamiorkov:demo-vue amiorkov$ tns run ios --bundle
Skipping node_modules folder! Use the syncAllFiles option to sync files from this folder.
Searching for devices...
Hook skipped because bundling is in progress.
Running webpack for iOS...
Bundling application for entryPath ./app...
clean-webpack-plugin: /Users/amiorkov/Desktop/Work/nativescript-picker/demo-vue/platforms/ios/demovue/app/**/* has been removed.
File change detected. Starting incremental webpack compilation...

webpack is watching the files…

Hash: dc17d411deb334f52752
Version: webpack 4.27.1
Time: 17956ms
Built at: 02/26/2019 3:08:31 PM
Asset Size Chunks Chunk Names
../../../../../src/angular/index.d.ts 96 bytes [emitted]
../../../../../src/angular/nativescript-picker.accessors.d.ts 324 bytes [emitted]
../../../../../src/angular/nativescript-picker.directives.d.ts 607 bytes [emitted]
../../../../../src/angular/nativescript-picker.module.d.ts 50 bytes [emitted]
../../../../../src/picker.android.d.ts 221 bytes [emitted]
../../../../../src/picker.common.d.ts 4.6 KiB [emitted]
../../../../../src/picker.d.ts 193 bytes [emitted]
../../../../../src/picker.ios.d.ts 193 bytes [emitted]
../../../../../src/vue/component.d.ts 821 bytes [emitted]
../../../../../src/vue/index.d.ts 105 bytes [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/Contents.json 2.31 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-1024.png 57.1 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-20.png 1.07 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-20@2x.png 2.69 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-20@3x.png 4.55 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-29.png 1.64 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-29@2x.png 3.09 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-29@3x.png 4.36 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-40.png 2.29 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-40@2x.png 4.47 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-40@3x.png 6.41 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-60@2x.png 6.41 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-60@3x.png 9.15 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-76.png 4.25 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-76@2x.png 8.69 KiB [emitted]
App_Resources/iOS/Assets.xcassets/AppIcon.appiconset/icon-83.5@2x.png 9.74 KiB [emitted]
App_Resources/iOS/Assets.xcassets/Contents.json 62 bytes [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Contents.json 5.13 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-1125h.png 160 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-568h@2x.png 62.2 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-667h@2x.png 112 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-736h@3x.png 180 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-Landscape-X.png 165 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-Landscape.png 60.9 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-Landscape@2x.png 187 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-Landscape@3x.png 198 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-Portrait.png 59.5 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default-Portrait@2x.png 182 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default.png 20.3 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Default@2x.png 61.4 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/Phone XS Max - Portarit iOS 12.png 72.7 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/iPhone XR - Landscape iOS 12.png 43.2 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/iPhone XR - Portarit iOS 12.png 43.4 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchImage.launchimage/iPhone XS Max – Landscape iOS 12.png 71.5 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.AspectFill.imageset/Contents.json 425 bytes [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.AspectFill.imageset/LaunchScree.AspectFill@3x.png 34.4 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.AspectFill.imageset/LaunchScreen-AspectFill.png 1.67 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.AspectFill.imageset/LaunchScreen-AspectFill@2x.png 3.9 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.Center.imageset/Contents.json 414 bytes [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.Center.imageset/LaunchScreen-Center.png 65.3 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.Center.imageset/LaunchScreen-Center@2x.png 202 KiB [emitted]
App_Resources/iOS/Assets.xcassets/LaunchScreen.Center.imageset/LaunchScreen.Center@3x.png 91.9 KiB [emitted]
App_Resources/iOS/Info.plist 1.43 KiB [emitted]
App_Resources/iOS/LaunchScreen.storyboard 4.04 KiB [emitted]
App_Resources/iOS/build.xcconfig 504 bytes [emitted]
bundle.js 67.2 KiB bundle [emitted] bundle
fonts/FontAwesome.ttf 162 KiB [emitted]
package.json 155 bytes [emitted]
starter.js 39 bytes [emitted]
vendor.js 1.6 MiB vendor [emitted] vendor
Entrypoint bundle = vendor.js bundle.js
[../../src/picker.common.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.common.ts 15.9 KiB {bundle} [built]
[../../src/picker.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.ts 573 bytes {bundle} [built]
[../../src/vue/component.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/component.ts 3.1 KiB {bundle} [built]
[../../src/vue/index.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/index.ts 404 bytes {bundle} [built]
[./ sync ^./app.(css|scss|less|sass)$] . sync nonrecursive ^./app.(css|scss|less|sass)$ 175 bytes {bundle} [built]
[./ sync recursive (root|page).(xml|css|js|ts|scss)$] . sync (root|page).(xml|css|js|ts|scss)$ 160 bytes {bundle} [built]
[./app.js] 1.31 KiB {bundle} [built]
[./app.scss] 19.8 KiB {bundle} [optional] [built]
[./package.json] 119 bytes {bundle} [optional] [built]
+ 159 hidden modules
Webpack compilation complete. Watching for file changes.
Webpack build done!
File change detected. Starting incremental webpack compilation...
Hook skipped because either bundling or livesync is in progress.
Preparing project...
Project successfully prepared (iOS)
Hash: f89f7e9680823be9cdce
Version: webpack 4.27.1
Time: 2090ms
Built at: 02/26/2019 3:08:34 PM
Asset Size Chunks Chunk Names
../../../../../src/angular/index.d.ts 96 bytes [emitted]
../../../../../src/angular/nativescript-picker.accessors.d.ts 324 bytes [emitted]
../../../../../src/angular/nativescript-picker.directives.d.ts 607 bytes [emitted]
../../../../../src/angular/nativescript-picker.module.d.ts 50 bytes [emitted]
../../../../../src/picker.android.d.ts 221 bytes [emitted]
../../../../../src/picker.common.d.ts 4.6 KiB [emitted]
../../../../../src/picker.d.ts 193 bytes [emitted]
../../../../../src/picker.ios.d.ts 193 bytes [emitted]
../../../../../src/vue/component.d.ts 821 bytes [emitted]
../../../../../src/vue/index.d.ts 105 bytes [emitted]
bundle.js 67.2 KiB bundle [emitted] bundle

• 1 hidden asset
  Entrypoint bundle = vendor.js bundle.js
  [../../src/picker.common.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.common.ts 15.9 KiB {bundle} [built]
  [../../src/picker.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.ts 573 bytes {bundle} [built]
  [../../src/vue/component.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/component.ts 3.1 KiB {bundle} [built]
  [../../src/vue/index.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/index.ts 404 bytes {bundle} [built]
  • 164 hidden modules
    Webpack compilation complete. Watching for file changes.
    Webpack build done!
    File change detected. Starting incremental webpack compilation...
    Successfully transferred bundle.js on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817.
    Successfully transferred fonts on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817.
    Successfully transferred FontAwesome.ttf on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817.
    Successfully transferred package.json on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817.
    Successfully transferred starter.js on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817.
    Successfully transferred vendor.js on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817.
    Restarting application on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817...
    Hash: 5e9d24ad39156e54cc13
    Version: webpack 4.27.1
    Time: 1755ms
    Built at: 02/26/2019 3:08:36 PM
    Asset Size Chunks Chunk Names
    ../../../../../src/angular/index.d.ts 96 bytes [emitted]
    ../../../../../src/angular/nativescript-picker.accessors.d.ts 324 bytes [emitted]
    ../../../../../src/angular/nativescript-picker.directives.d.ts 607 bytes [emitted]
    ../../../../../src/angular/nativescript-picker.module.d.ts 50 bytes [emitted]
    ../../../../../src/picker.android.d.ts 221 bytes [emitted]
    ../../../../../src/picker.common.d.ts 4.6 KiB [emitted]
    ../../../../../src/picker.d.ts 193 bytes [emitted]
    ../../../../../src/picker.ios.d.ts 193 bytes [emitted]
    ../../../../../src/vue/component.d.ts 821 bytes [emitted]
    ../../../../../src/vue/index.d.ts 105 bytes [emitted]
    bundle.js 67.2 KiB bundle [emitted] bundle
• 1 hidden asset
  Entrypoint bundle = vendor.js bundle.js
  [../../src/picker.common.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.common.ts 15.9 KiB {bundle} [built]
  [../../src/picker.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.ts 573 bytes {bundle} [built]
  [../../src/vue/component.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/component.ts 3.1 KiB {bundle} [built]
  [../../src/vue/index.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/index.ts 404 bytes {bundle} [built]
  • 164 hidden modules
    Webpack compilation complete. Watching for file changes.
    Webpack build done!
    File change detected. Starting incremental webpack compilation...
    Successfully synced application org.nativescript.picker.demovue on device BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817.
    Hash: a59b5dd2ee53ef1f73ce
    Version: webpack 4.27.1
    Time: 2087ms
    Built at: 02/26/2019 3:08:38 PM
    Asset Size Chunks Chunk Names
    ../../../../../src/angular/index.d.ts 96 bytes [emitted]
    ../../../../../src/angular/nativescript-picker.accessors.d.ts 324 bytes [emitted]
    ../../../../../src/angular/nativescript-picker.directives.d.ts 607 bytes [emitted]
    ../../../../../src/angular/nativescript-picker.module.d.ts 50 bytes [emitted]
    ../../../../../src/picker.android.d.ts 221 bytes [emitted]
    ../../../../../src/picker.common.d.ts 4.6 KiB [emitted]
    ../../../../../src/picker.d.ts 193 bytes [emitted]
    ../../../../../src/picker.ios.d.ts 193 bytes [emitted]
    ../../../../../src/vue/component.d.ts 821 bytes [emitted]
    ../../../../../src/vue/index.d.ts 105 bytes [emitted]
    bundle.js 67.2 KiB bundle [emitted] bundle
• 1 hidden asset
  Entrypoint bundle = vendor.js bundle.js
  [../../src/picker.common.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.common.ts 15.9 KiB {bundle} [built]
  [../../src/picker.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/picker.ts 573 bytes {bundle} [built]
  [../../src/vue/component.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/component.ts 3.1 KiB {bundle} [built]
  [../../src/vue/index.ts] /Users/amiorkov/Desktop/Work/nativescript-picker/src/vue/index.ts 404 bytes {bundle} [built]
  • 164 hidden modules
    Skipping prepare.
    Webpack compilation complete. Watching for file changes.
    Webpack build done!
    File change detected. Starting incremental webpack compilation...
    ^CUnable to apply changes for device: BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817. Error is: Command xcrun with arguments simctl get_app_container BA5F8C17-1C0D-41EF-8DA6-D7AF6503F817 org.nativescript.picker.demovue failed with exit code null. Error output:
    .
    Stopping webpack watch
    ^C
    mcsofamiorkov:demo-vue amiorkov$

[yassilah]

I'm running into the exact same issue while developing my own plugin. the only solution so far was to remove ".ts" files from the webpack "resolve" option.

[rosen-vladimirov]

Hey, sorry for the delayed reply. The problem is caused by having declaration: true in tsconfig.json of the plugin. The demo-vue project is JavaScript and even if you place tsconfig.json at its root, as there are no .ts files in the demo, this tsconfig.json will not be used. As the linked plugin has .ts files, ts-loader uses the tsconfig.json from the src directory. In this tsconfig.json the declaration is set to true, so each change in .ts file produces new .d.ts files. Webpack's watcher detects these new .d.ts files and starts new compilation, which produces new .d.ts files, etc.

There are various ways to resolve this. One of them is to pass declaration: false to ts-loader and that's exactly what I've implemented in the related PR.
Another way is to pass full path to tsconfig.json (the one located in the project), but I've decided that it is not expected to have tsconfig.json in a JavaScript project, so this solution would not resolve all cases.

Hope this clears it out.