Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/wix/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 网页2+;Typescript2无法动态导入json_Javascript_Typescript_Webpack - Fatal编程技术网

Javascript 网页2+;Typescript2无法动态导入json

Javascript 网页2+;Typescript2无法动态导入json,javascript,typescript,webpack,Javascript,Typescript,Webpack,我在使用webpack动态导入json时遇到问题。 () 它显示此错误-TS2307:找不到模块 软件包版本为 网页包版本:2.7.0 打字稿版本:2.4.2 很棒的typescript加载程序:3.2.1 tsconfig.json { "compilerOptions": { "outDir": "./dist/", "sourceMap": true, "noImplicitAny": true, "module": "esnext", "m

我在使用webpack动态导入json时遇到问题。 ()

它显示此错误-TS2307:找不到模块

软件包版本为

  • 网页包版本:2.7.0

  • 打字稿版本:2.4.2

  • 很棒的typescript加载程序:3.2.1

tsconfig.json

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "noImplicitAny": true,
    "module": "esnext",
    "moduleResolution": "node",
    "target": "es6",
    "jsx": "react",
    "allowJs": true,
    "allowSyntheticDefaultImports": true
  },
  "awesomeTypescriptLoaderOptions": {
    "useBabel": true,
    "useCache": true
  },
  "exclude": ["node_modules"],
  "include": [
    "./components/**/*",
    "./core/*",
    "./pages/*",
    "./utils/*",
    "./urls/*",
    "./translations/**/*",
    "./main.tsx"
  ]
}
webpack.config.js

const path = require('path');
const webpack = require('webpack');
const AssetsPlugin = require('assets-webpack-plugin');
const pkg = require('./package.json');

const isDebug = global.DEBUG === false ? false : !process.argv.includes('--release');
const isVerbose = process.argv.includes('--verbose') || process.argv.includes('-v');
const useHMR = !!global.HMR; // Hot Module Replacement (HMR)
const babelConfig = Object.assign({}, pkg.babel, {
  babelrc: false,
  cacheDirectory: useHMR,
});

// Webpack configuration (main.js => public/dist/main.{hash}.js)
// http://webpack.github.io/docs/configuration.html
const config = {

  // The base directory for resolving the entry option
  context: __dirname,

  // The entry point for the bundle
  entry: [
    // require('babel-polyfill'),
    './main.tsx'
  ],

  // Options affecting the output of the compilation
  output: {
    path: path.resolve(__dirname, './public/dist'),
    publicPath: '/dist/',
    filename: isDebug ? '[name].js?[hash]' : '[name].[hash].js',
    chunkFilename: isDebug ? '[id].js?[chunkhash]' : '[id].[chunkhash].js',
    sourcePrefix: '  ',
  },

  // Developer tool to enhance debugging, source maps
  // http://webpack.github.io/docs/configuration.html#devtool
  devtool: isDebug ? 'inline-source-map' : false,

  // What information should be printed to the console
  stats: {
    colors: true,
    reasons: isDebug,
    hash: isVerbose,
    version: isVerbose,
    timings: true,
    chunks: isVerbose,
    chunkModules: isVerbose,
    cached: isVerbose,
    cachedAssets: isVerbose,
  },

  // The list of plugins for Webpack compiler
  plugins: [
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': isDebug ? '"development"' : '"production"',
      __DEV__: isDebug,
    }),
    // Emit a JSON file with assets paths
    // https://github.com/sporto/assets-webpack-plugin#options
    new AssetsPlugin({
      path: path.resolve(__dirname, './public/dist'),
      filename: 'assets.json',
      prettyPrint: true,
    }),
  ],

  // Options affecting the normal modules
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        include: [
          path.resolve(__dirname, './components'),
          path.resolve(__dirname, './core'),
          path.resolve(__dirname, './pages'),
          path.resolve(__dirname, './apis'),
          path.resolve(__dirname, './urls'),
          path.resolve(__dirname, './translations'),
          path.resolve(__dirname, './main')
        ],
        loader: 'awesome-typescript-loader'
      },
      {
        test: /\.css/,
        use: [{loader: 'style-loader'}, {loader: 'css-loader', options:
          {
            sourceMap: isDebug,
            // CSS Modules https://github.com/css-modules/css-modules
            modules: true,
            localIdentName: isDebug ? '[name]_[local]_[hash:base64:3]' : '[hash:base64:4]',
            // CSS Nano http://cssnano.co/options/
            minimize: !isDebug,
          }},
          // {loader: 'postcss-loader'}
          ],
      },
      {
        test: /\.(png|jpg|jpeg|gif|svg|woff|woff2)$/,
        loader: 'url-loader?limit=10000',
      },
      {
        test: /\.(eot|ttf|wav|mp3)$/,
        loader: 'file-loader',
      },
    ],
  },

  externals: {
    react: 'React'
  },

  resolve: {
    extensions: ['.js', '.ts', '.tsx']
  }
};

// Optimize the bundle in release (production) mode
if (!isDebug) {
  config.plugins.push(new webpack.optimize.UglifyJsPlugin({ compress: { warnings: isVerbose }, sourceMap: isDebug }));
  config.plugins.push(new webpack.optimize.AggressiveMergingPlugin());
}

// Hot Module Replacement (HMR) + React Hot Reload
if (isDebug && useHMR) {
  babelConfig.plugins.unshift('react-hot-loader/babel');
  config.entry.unshift('react-hot-loader/patch', 'webpack-hot-middleware/client');
  config.plugins.push(new webpack.HotModuleReplacementPlugin());
  config.plugins.push(new webpack.NoEmitOnErrorsPlugin());
}

module.exports = config;
定制d.ts

declare module "*.json" {
  const value: any;
  export default value;
}
我的错误代码

// TS2307: Cannot find module './test.json'.
import('./test.json').then(_ => {
  console.log(_
})

// but these codes work
import './test.json'
import('./test.js').then(_ => { console.log(_)})
我尽可能多地搜索问题。但似乎没有人遇到这个问题

以下是我发现的相关链接


如果有人有任何线索,请告诉我。

您确定您的custom.d.ts位于编译中包含的文件夹中吗?我相信只有在
node\u modules/@types
下的包中键入的内容,如果它们不在
的“文件”
“include”
属性的
tsconfig.json

中,才包括在内。您确定您的自定义.d.ts在编译中包含的文件夹中吗?我相信只有在
节点_modules/@types
下的包中键入,如果它们不在
的“文件”
的“include”
属性中,才包括在
tsconfig.json