Custom webpack config alias not working in ionic 2

I am using environment alias in my custom config like this package.json

 "config": {
    "ionic_bundler": "webpack",
    "ionic_webpack": "./config/webpack-extension.config.js"
  }

      

Webpack-extension.config.js

/*
inspired by:
    https://github.com/driftyco/ionic-app-scripts/pull/683#issuecomment-287401855
*/

let path = require('path')
let useDefaultConfig = require('@ionic/app-scripts/config/webpack.config.js')

module.exports = function () {

useDefaultConfig.resolve.alias = {
    "@app/env": path.resolve(__dirname, '../src/environments/env.' + process.env.IONIC_ENV + '.ts'),
};

return useDefaultConfig;
}

      

environment.ts

import {

isDEV,
API_HOST,
...etc

} from '@app/env'

      

But I am getting the error:

Typescript Error
Cannot find module '@app/env'.

      

+3


source to share


1 answer


After hard googling I found this fix (let the typescript loader know the alias): tsconfig.json

  "compilerOptions": {
...
    "baseUrl":  "./src",
    "paths": {
      "@app/config": ["config/config"]
    }
  }
...

      

credit: https://github.com/ionic-team/ionic-app-scripts/pull/683#issuecomment-294078919

My ionic info:

cli packages: (/Users/.../node_modules)

@ionic/cli-plugin-cordova       : 1.6.2
@ionic/cli-plugin-ionic-angular : 1.4.1
@ionic/cli-utils                : 1.7.0
ionic (Ionic CLI)               : 3.7.0

      

global packages:



Cordova CLI : 7.0.1 

      

local packages:

@ionic/app-scripts : 2.1.3
Cordova Platforms  : none
Ionic Framework    : ionic-angular 3.6.0

      

System:

Node       : v6.9.5
OS         : macOS Sierra
Xcode      : Xcode 8.3.3 Build version 8E3004b 
ios-deploy : 1.9.1 
ios-sim    : 5.0.13 
npm        : 5.3.0 

      

+3


source







All Articles