离子2中无法从JS切换到TS

Question

I changed the file extensions of my app files including app/app.js

Error: Cannot find module 'app/app.js' from 'app_folder'

It doesn't tell me which file I should be looking at to fix the error.

I tried looking with git grep and read a bit about Angular2's entry points to find out where it is loaded, but no luck yet.

Answer 1

Using TypeScript into an Ionic2 project isn't just switching extensions of files ;-)

You need to integrate the TypeScript compiler into Gulp with the gulp-tsc' plugin:

var typescript = require('gulp-tsc');

(...)

gulp.task('compile', function() {
  gulp.src(paths.src)
    .pipe(typescript({
      emitError: false
    }))
    .pipe(gulp.dest('www/js/'))
});

This page could help you:

• https://github.com/driftyco/ionic-typescript-example

Answer 2

Thierry Templier put me on the right track, and here is the answer.

Documentation in case anyone else is wondering.

Ionic2 is different than ionic1 basically uses browserify now. To switch from ES6 to TS, you would need to setup typscirpt for your project and set the dependencies like so:

1. in gulpfile.js change var buildBrowserify = require('ionic-gulp-browserify-es2015');
   for var buildBrowserify = require('ionic-gulp-browserify-typescript');
2. in package.json change ionic-gulp-browserify-es2015": "^1.0.2"
   for "ionic-gulp-browserify-typescript": "^1.0.0"

3. Install typescript

   3.1 npm install typings --global

   3.2 tsd query node --action install --save

4. Make sure you have the file your_app/typings/main.d.ts
   with the content: /// <reference path="main/ambient/es6-shim/index.d.ts" />

5. lastly the tsconfig.json file

   tsconfig{ "compilerOptions": { "target": "es5", "module": "commonjs", "emitDecoratorMetadata": true, "experimentalDecorators": true }, "filesGlob": [ "**/*.ts", "!node_modules/**/*" ], "exclude": [ "node_modules", "typings/main", "typings/main.d.ts" ], "compileOnSave": false, "atom": { "rewriteTsconfig": false } }