Question

我在TypeScript中使用我的前端脚本有一个ASP.NET MVC解决方案。我正在尝试使用带有ts-loader的webpack和babel，所以我可以用es2016进行开发，但是让babel转换为es5，并且能够在IE中从Visual Studio运行和调试。但是我发现输出js没有按照我的预期进行转换。例如，我的ts中的以下陈述出现在我生成的js中，而不是es5：

import * as moment from 'moment'; 
import { classes } from './order';

这是我的配置：

.babelrc

{
    "presets": ["es2015"]
}

webpack.config.js

var path = require('path');

module.exports = {
    context: path.join(__dirname, 'Scripts'),
    entry: ['babel-polyfill', './pos.ts'],
    output: {
        path: path.join(__dirname, 'Scripts'),
        filename: '[name].js'
    },
    resolve: {
        extensions: ['.js', '.ts']
    },
    module: {
        loaders: [{
            test: /\.ts$/,
            loaders: ['babel-loader', 'ts-loader'],
            exclude: /(node_modules|bower_components)/
        }]
    },
    devtool: 'inline-source-map'
};

tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "noImplicitAny": true,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es2016",
    "module": "es2015",
    "lib": [ "dom", "es2015", "es2016" ],
    "allowSyntheticDefaultImports": true,
    "moduleResolution": "node",
    "preserveConstEnums": true,
    "skipLibCheck": true
  },
  "include": [
    "node_modules/@types/**/*.d.ts",
    "Scripts/**/*.ts"
  ]
}

的package.json

{
  "version": "1.0.0",
  "name": "foo",
  "readme": "README.md",
  "description": "foo",
  "devDependencies": {
    "babel-core": "^6.25.0",
    "babel-loader": "^7.1.1",
    "babel-preset-es2015": "^6.24.1",
    "del": "^2.2.2",
    "gulp": "^3.9.1",
    "gulp-bower": "^0.0.13",
    "gulp-clean-css": "^3.4.1",
    "gulp-concat": "^2.6.1",
    "gulp-copy": "^1.0.0",
    "gulp-less": "^3.3.0",
    "gulp-rimraf": "^0.2.1",
    "gulp-sass": "^3.1.0",
    "gulp-shell": "^0.6.3",
    "gulp-sourcemaps": "^2.6.0",
    "gulp-tsc": "^1.3.2",
    "gulp-uglify": "^3.0.0",
    "gulp-util": "^3.0.8",
    "merge-stream": "^1.0.1",
    "node-sass": "^4.5.3",
    "run-sequence": "^1.2.2",
    "ts-loader": "^2.3.2",
    "webpack": "^3.4.1",
    "webpack-dev-server": "^2.6.1",
    "webpack-notifier": "^1.5.0"
  },
  "dependencies": {
    "@types/jquery": "^2.0.46",
    "@types/bootstrap-touchspin": "",
    "@types/maskedinput": "",
    "@types/bootstrap-select": ""
  },
  "scripts": {
    "build": "webpack",
    "watch": "webpack --watch",
    "start": "webpack-dev-server --hot --inline"
  }
}

Webpack似乎成功运行，因为没有错误，我的ts创建了js。我认为正在调用Babel，因为如果我输入了无效的预设，我会收到错误。但是如上所述，似乎Babel并没有转变为es5。我已经尝试过env和2016等其他预设。我缺少什么？

通天塔转换导入语句

0 个答案: