Ionic build can't find generated js files


#1

Hello, I am using Meteor with Ionic cli. it was working fine but now it stopped working after an update with Ionic. I tried downgrading but it didn’t work.

Here is the error showing when I try to run:

Error: ./api/server/collections/Listings.ts
Module build failed: Error: ENOENT: no such file or directory, open '/Users/Jayser/Documents/aplicaciones/firestore/api/server/collections/Listings.js'
 @ ./src/providers/listing/listing.ts 6:17-52
 @ ./src/app/app.module.ngfactory.ts
 @ ./src/app/main.ts
    at new BuildError (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/@ionic/app-scripts/dist/util/errors.js:16:28)
    at callback (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/@ionic/app-scripts/dist/webpack.js:123:28)
    at emitRecords.err (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/webpack/lib/Compiler.js:269:13)
    at Compiler.emitRecords (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/webpack/lib/Compiler.js:375:38)
    at emitAssets.err (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/webpack/lib/Compiler.js:262:10)
    at applyPluginsAsyncSeries1.err (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/webpack/lib/Compiler.js:368:12)
    at next (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/tapable/lib/Tapable.js:218:11)
    at Compiler.compiler.plugin (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/webpack/lib/performance/SizeLimitsPlugin.js:99:4)
    at Compiler.applyPluginsAsyncSeries1 (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/tapable/lib/Tapable.js:222:13)
    at Compiler.afterEmit (/Users/Jayser/Documents/aplicaciones/firestore/node_modules/webpack/lib/Compiler.js:365:9)

My webpack config is the following:

var path = require('path');
var webpack = require('webpack');
var ionicWebpackFactory = require(process.env.IONIC_WEBPACK_FACTORY);

var ModuleConcatPlugin = require('webpack/lib/optimize/ModuleConcatenationPlugin');
var PurifyPlugin = require('@angular-devkit/build-optimizer').PurifyPlugin;

var optimizedProdLoaders = [
  {
    test: /\.json$/,
    loader: 'json-loader'
  },
  {
    test: /\.js$/,
    loader: [
      {
        loader: process.env.IONIC_CACHE_LOADER
      },

      {
        loader: '@angular-devkit/build-optimizer/webpack-loader',
        options: {
          sourceMap: true
        }
      },
    ]
  },
  {
    test: /\.ts$/,
    loader: [
      {
        loader: process.env.IONIC_CACHE_LOADER
      },

      {
        loader: '@angular-devkit/build-optimizer/webpack-loader',
        options: {
          sourceMap: true
        }
      },

      {
        loader: process.env.IONIC_WEBPACK_LOADER
      }
    ]
  }
];

function getProdLoaders() {
  if (process.env.IONIC_OPTIMIZE_JS === 'true') {
    return optimizedProdLoaders;
  }
  return devConfig.module.loaders;
}

var devConfig = {
  entry: process.env.IONIC_APP_ENTRY_POINT,
  output: {
    path: '{{BUILD}}',
    publicPath: 'build/',
    filename: '[name].js',
    devtoolModuleFilenameTemplate: ionicWebpackFactory.getSourceMapperFunction(),
  },
  devtool: process.env.IONIC_SOURCE_MAP_TYPE,

  resolve: {
    extensions: ['.ts', '.js', '.json'],
    modules: [path.resolve('node_modules')],
    alias: {
      'api': path.resolve(__dirname, 'api/server')
    }
  },

  externals: [
    {
      sharp: '{}'
    },
    resolveExternals
  ],

  module: {
    loaders: [
      {
        test: /\.json$/,
        loader: 'json-loader'
      },
      {
        test: /\.ts$/,
        loader: process.env.IONIC_WEBPACK_LOADER
      }
    ]
  },

  plugins: [
    ionicWebpackFactory.getIonicEnvironmentPlugin(),
    ionicWebpackFactory.getCommonChunksPlugin(),
    new webpack.ProvidePlugin({
      __extends: 'typescript-extends'
    })
  ],

  // Some libraries import Node modules but don't use them in the browser.
  // Tell Webpack to provide empty mocks for them so importing them works.
  node: {
    fs: 'empty',
    net: 'empty',
    tls: 'empty',
    __dirname: true
  }
};

var prodConfig = {
  entry: process.env.IONIC_APP_ENTRY_POINT,
  output: {
    path: '{{BUILD}}',
    publicPath: 'build/',
    filename: '[name].js',
    devtoolModuleFilenameTemplate: ionicWebpackFactory.getSourceMapperFunction(),
  },
  devtool: process.env.IONIC_SOURCE_MAP_TYPE,

  resolve: {
    extensions: ['.ts', '.js', '.json'],
    modules: [path.resolve('node_modules')],
    alias: {
      'api': path.resolve(__dirname, 'api/server')
    }
  },

  externals: [
    {
      sharp: '{}'
    },
    resolveExternals
  ],

  module: {
    loaders: getProdLoaders()
  },

  plugins: [
    ionicWebpackFactory.getIonicEnvironmentPlugin(),
    ionicWebpackFactory.getCommonChunksPlugin(),
    new ModuleConcatPlugin(),
    new PurifyPlugin(),
    new webpack.ProvidePlugin({
      __extends: 'typescript-extends'
    })
  ],

  // Some libraries import Node modules but don't use them in the browser.
  // Tell Webpack to provide empty mocks for them so importing them works.
  node: {
    fs: 'empty',
    net: 'empty',
    tls: 'empty',
    __dirname: true
  }
};


module.exports = {
  dev: devConfig,
  prod: prodConfig
}

function resolveExternals(context, request, callback) {
  return resolveMeteor(request, callback) ||
    callback();
}
 
function resolveMeteor(request, callback) {
  var match = request.match(/^meteor\/(.+)$/);
  var pack = match && match[1];
 
  if (pack) {
    callback(null, 'Package["' + pack + '"]');
    return true;
  }
}

My tsconfig.js is the following:

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "declaration": false,
    "baseUrl": ".",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [
      "dom",
      "es2015",
      "es2016"
    ],
    "module": "commonjs",
    "moduleResolution": "node",
    "paths": {
      "api/*": ["./api/server/*"]
    },
    "sourceMap": true,
    "target": "es5",
    "skipLibCheck": true,
    "stripInternal": true,
    "noImplicitAny": false,
    "types": [
      "@types/meteor",
      "@types/underscore",
      "@types/meteor-collection-hooks"
    ]
  },
  "include": [
    "src/**/*.ts",
    "api/**/*.ts"
  ],
  "exclude": [
    "node_modules",
    "api/node_modules",
    "api"
  ],
  "compileOnSave": false,
  "atom": {
    "rewriteTsconfig": false
  }
}

and my ionic info is the following:

cli packages: (/usr/local/lib/node_modules)

@ionic/cli-utils  : 1.13.0
ionic (Ionic CLI) : 3.13.0

global packages:

cordova (Cordova CLI) : 7.0.1 

local packages:

@ionic/app-scripts : 3.0.0
Cordova Platforms  : android 6.3.0
Ionic Framework    : ionic-angular 3.7.1

System:

ios-deploy : 1.9.1 
ios-sim    : 5.0.13 
Node       : v8.7.0
npm        : 5.4.2 
OS         : macOS High Sierra
Xcode      : Xcode 8.3.3 Build version 8E3004b 

Misc:

backend : legacy

Any help on this please?


#2

Hi,

I too facing this issue from past few days. Before its working fine.
but now its looking for js file and build failed.

Have you resolved this issue ?