typescript - 为什么 Webpack 不排除我指定的文件夹?

标签 typescript webpack definitelytyped

我将我的服务器和客户端代码保存在同一个存储库中,尽管我使用 Webpack 只构建客户端:

enter image description here

如果我删除 src/server 文件夹,我的项目构建良好。但是当它在那里时,我得到了所有这些 Webpack Typescript 重复定义错误,例如:

[1m[31mERROR in /home/rje/projects/ekaya/typings/main/ambient/react-dom/index.d.ts
(70,5): error TS2300: Duplicate identifier 'export='.

这是由 Webpack 尝试构建我的服务器文件夹中包含的文件之一引起的:

/// <reference path="../../../../typings/main.d.ts" />

如何让 Webpack 完全忽略服务器文件夹?

我已经在我的 webpack.config.js 中尝试过:

var rootPath = __dirname; 
var srcPath = path.join(rootPath, 'src/client');
var distPath = path.join(rootPath, 'dist/client');
var serverPath = path.join(rootPath, 'src/serve
...
loaders:
        [
            {test: /\.js$/, loader: 'babel-loader?cacheDirectory', include: [srcPath], exclude: [serverPath]},
            {test: /\.jsx$/, loader: 'babel-loader?cacheDirectory', include: [srcPath], exclude: [serverPath] },
            {test: /\.ts$/, loader: 'ts-loader?cacheDirectory', include: [srcPath], exclude: [serverPath] },
            {test: /\.tsx$/, loader: 'ts-loader?cacheDirectory', include: [srcPath], exclude: [serverPath] },

如果有帮助,这里是完整的 webpack 配置:

//https://webpack.github.io/docs/configuration.html

var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var CopyWebpackPlugin = require('copy-webpack-plugin');
var path = require('path');
var rootPath = __dirname; // e.g.  ~/projects/ekaya
var srcPath = path.join(rootPath, 'src/client');
var distPath = path.join(rootPath, 'dist/client');
var serverPath = path.join(rootPath, 'src/server');

module.exports =
{
    bail: true,
    cache: false,
    context: rootPath,
    debug: true,
    devtool: 'source-map', //inline-source-map, https://webpack.github.io/docs/configuration.html#devtool
    target: 'web', //node, web
    devServer:
    {
        contentBase: distPath,
        historyApiFallback: true,
        outputPath: path.join(distPath, 'devServer')
    },
    entry:
    {
        app: path.join(srcPath, 'app/home.jsx'),
        lib: ['react', 'react-router', 'react-dom', 'jquery', 'lodash', 'history']
    },
    output:
    {
        path: distPath,
        publicPath: '',
        filename: '[name].js',
        pathInfo: true
    },
    resolve:
    {
        root: srcPath,
        extensions: ['', '.js', '.jsx', '.ts', '.tsx'],
        modulesDirectories: ['node_modules', srcPath, 'typings']
    },
    module:
    {
        loaders:
        [
            {test: /\.js$/, loader: 'babel-loader?cacheDirectory', include: [srcPath], exclude: [serverPath]},
            {test: /\.jsx$/, loader: 'babel-loader?cacheDirectory', include: [srcPath], exclude: [serverPath] },
            {test: /\.ts$/, loader: 'ts-loader?cacheDirectory', include: [srcPath], exclude: [serverPath] },
            {test: /\.tsx$/, loader: 'ts-loader?cacheDirectory', include: [srcPath], exclude: [serverPath] },
            {test: /\.scss$/, loaders: ['style', 'css', 'sass']},
            {test: /\.png$/, loader: 'file-loader'},
            {test: /\.jpg$/, loader: 'file-loader'},
            {test: /\.jpeg$/, loader: 'file-loader'},
            {test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader?mimetype=image/svg+xml'},
            {test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader?mimetype=application/font-woff"},
            {test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader?mimetype=application/font-woff"},
            {test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader?mimetype=application/octet-stream"},
            {test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader"}
        ]
    },
    plugins:
    [
        new CopyWebpackPlugin
        ([
            { from: path.join(srcPath, 'images'), to: 'images' }
        ]),
        new webpack.optimize.CommonsChunkPlugin('lib', 'lib.js'),
        new HtmlWebpackPlugin
        ({
            inject: true,
            template: path.join(srcPath, 'index.html')
        }),
        new webpack.NoErrorsPlugin()
    ]
};

最佳答案

您是否尝试过排除 tsconfig.json 中的文件夹?

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    ...
  },
  "exclude": [
    "src/server",
    "node_modules"
  ]
}

关于typescript - 为什么 Webpack 不排除我指定的文件夹?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37054652/

相关文章:

angular - 如何重用底层控件的验证器?

javascript - 从 html (webpack) 引用散列的 svg

angular - angular2 项目中的类型是什么?

svg - 在 TypeScript 项目中使用 Path2D 未解决

node.js - 如何在 Node 应用程序中使用@types/node

javascript - 为什么 Record<string, any> 可以等于 Functions?

typescript - 为什么 typescript loader 会导致 html webpack 插件出错?

angular - TypeError : You provided an invalid object where a stream was expected. 您可以提供一个 Observable、Promise、Array 或 Iterable

node.js - Nodejs 核心模块 fs 无法与 webpack 和 angular2 cli 一起使用

angularjs - DefinitelyTyped: 'export = _;' 是什么意思