WebPack ve typescript: Ben webpack, typescript ve react.js <a href="https://www.npmjs.com/package/awesome-typescript-loader" rel="noreferrer">awesome-typescript-loader</a> yoluyla birlikte çalışma almaya çalıştı node.d.ts

Question

modül 'child_process' çözülemiyor ama sürekli hatalar olsun.

module.exports = { 
    entry: './ui/index.ts', 
    output: { 
     path: __dirname + '/build-ui', 
     filename: 'app.js', 
     publicPath: 'http://localhost:8090/assets' 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.jsx$/, 
       loader: 'jsx-loader?insertPragma=React.DOM&harmony' 
      }, 
      { 
       test: /\.css$/, 
       loader: "style-loader!css-loader" 
      }, 
      { 
       test: /\.scss$/, 
       loader: "style-loader!css-loader!sass-loader" 
      }, 
      { 
       test: /\.(png|jpg)$/, 
       loader: 'url-loader?limit=8192' 
      }, 
      { 
       test: /\.ts$/, 
       loader: 'awesome-typescript-loader' 
      } 
     ] 
    }, 
    resolve: { 
     extensions: ['', '.js', '.jsx', '.ts'] 
    } 
}; 

Ben çalıştırdığınızda webpack dev: Ben Versiyon 0.3.0-rc.2 ve WebPack de müthiş typescript yükleyici kullanıyorum

1.8.9

Bu benim webpack.config.js olduğunu sunucu ve benim index.ts şöyle görünür:

:

alert('hello'); 

aşağıdaki hatayı bildiren 10

Referans yolunu koyduğumda da aynı. Ben import React = require('react'); aracılığıyla React.js almaya çalıştığınızda

belirtir:

ERROR in ./ui/index.ts 
Module build failed: Cannot resolve module 'child_process' in /..../typings/node 
    Required in /..../typings/node/node.d.ts 

Hala yükleyici repo node.d.ts dosyasını, hiç şans kopyalandı.

Bu kombinasyon çalışmasını sorunsuz bir şekilde gerçekleştiren oldu mu? Ya da sadece farklı bir web paketleyici kullanmalı mıyım? Webpack ile çalışmayı gerçekten çok isterim.

Answer 1

Tüm Kaçırdığınız bir anahtar target: 'node' olduğunu.

Bu hedeflediğiniz çevre node.js değil tarayıcı ve bu nedenle yerli bağımlılıkları göz ardı edecektir emin olur.

Final Yapılandırma:

module.exports = { 
 
    entry: './ui/index.ts', 
 
    target: 'node', 
 
    output: { 
 
     path: __dirname + '/build-ui', 
 
     filename: 'app.js', 
 
     publicPath: 'http://localhost:8090/assets' 
 
    }, 
 
    module: { 
 
     loaders: [ 
 
      { 
 
       test: /\.jsx$/, 
 
       loader: 'jsx-loader?insertPragma=React.DOM&harmony' 
 
      }, 
 
      { 
 
       test: /\.css$/, 
 
       loader: "style-loader!css-loader" 
 
      }, 
 
      { 
 
       test: /\.scss$/, 
 
       loader: "style-loader!css-loader!sass-loader" 
 
      }, 
 
      { 
 
       test: /\.(png|jpg)$/, 
 
       loader: 'url-loader?limit=8192' 
 
      }, 
 
      { 
 
       test: /\.ts$/, 
 
       loader: 'awesome-typescript-loader' 
 
      } 
 
     ] 
 
    }, 
 
    resolve: { 
 
     extensions: ['', '.js', '.jsx', '.ts'] 
 
    } 
 
};

Answer 2

Farklı webpack TypeScript loader kullanmayı düşünebilirsiniz. Bir kaçının düğümle ilgili sorunları olduğunu biliyorum. Ayrıca yardımcı olabilecek bir çift starterkits vardır.

Yasal Uyarı: Ben ts-loader devam ettiren değilim.

Answer 3

Bir tsconfig.json dosyasını oluşturmayı deneyin. Örneğin

, sen awesome-typescript-loader kullandığınız olarak bu çalışması gerekir:

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "sourceMap": true, 
    "noEmitHelpers": true 
    }, 
    "exclude": [ 
    "node_modules" 
    ], 
    "awesomeTypescriptLoaderOptions": { 
    "forkChecker": true 
    }, 
    "compileOnSave": false, 
    "buildOnSave": false, 
    "atom": { "rewriteTsconfig": false } 
}