Javascript 如何使用webpack编译单个文件?

Javascript 如何使用webpack编译单个文件?,javascript,node.js,typescript,webpack,Javascript,Node.js,Typescript,Webpack,我正在设置一个typescript项目,它将从javascript文件迁移。下面是文件夹的结构 src --featureA ----script1.ts ----script2.ts ----index.ts --featureB ----script1.ts ----index.ts tsconfig.ts webpack.config.js package.json 我的tsconfig.ts { "compileOnSave": true, "compilerOptions":

我正在设置一个typescript项目,它将从javascript文件迁移。下面是文件夹的结构

src
--featureA
----script1.ts
----script2.ts
----index.ts
--featureB
----script1.ts
----index.ts
tsconfig.ts
webpack.config.js
package.json
我的tsconfig.ts

{
  "compileOnSave": true,
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "rootDir": "src",
    "outDir": "dist",
    "allowUnreachableCode": false,
    "allowUnusedLabels": false,
    "alwaysStrict": true,
    "noImplicitAny": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noFallthroughCasesInSwitch": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "suppressExcessPropertyErrors": false,
    "suppressImplicitAnyIndexErrors": false,
    "strictFunctionTypes": true,
    "strictNullChecks": true,
    "strictPropertyInitialization": true,
    "lib": ["es5", "dom"],
    "typeRoots": [
      "node_modules/@types"
    ],
  },
  "include": [
    "./src/**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}
我的网页包配置

const { CheckerPlugin } = require("awesome-typescript-loader");

module.exports = {
  mode: "development",

  resolve: {
    extensions: [".ts", ".tsx", ".js", ".jsx"]
  },

  devtool: "source-map",

  module: {
    rules: [
      {
        test: /\.tsx?$/,
        loaders: ["awesome-typescript-loader"]
      }
    ]
  },

  plugins: [
    new CheckerPlugin()
  ],

  devServer: {
    before(app) {
    },
    contentBase: "web"
  }
};
mypackage.json

"scripts": {
    "start": "webpack-dev-server"
  },
  "devDependencies": {
    "awesome-typescript-loader": "^3.5.0",
    "typescript": "^2.7.2",
    "typewiz": "^1.2.3",
    "typewiz-webpack": "^1.2.3",
    "webpack": "^4.20.0",
    "webpack-cli": "^3.1.1",
    "webpack-dev-server": "^3.1.0"
  }
功能A和B是独立的,我没有main.js文件作为入口点。如果我编译并缩小功能A,我将获得featureA.js文件并部署。这是我想要达到的结果

我仍然不知道这个设置是否符合我的要求?我如何使用webpack按需编译每个功能以及所需的命令,如下所示:

Input: npm compile featureA
Output: featureA.js (with minified)

你能帮我吗?

也许你可以使用多个入口点?像这样:

  entry: {
    featureA: './src/featureA/index.ts',
    featureB: './src/featureB/index.ts'
  }

Webpack将把这两个文件编译成两个单独的包。

也许您可以使用多个入口点?像这样:

  entry: {
    featureA: './src/featureA/index.ts',
    featureB: './src/featureB/index.ts'
  }
Webpack将把这两个文件编译成两个单独的包