ERROR in ./~ /constants-browserify/constants.json

Question

私はクライアント側とサーバー側でフォルダを分割しましたが、親フォルダからは動作しませんでした。私は2つの異なるフォルダ...今、私はHerokuにデプロイしたいですが、私は新しいルートフォルダからスクリプトを実行できるように、私はwebpack.configを変更すると考えました。私は私を助けていなかったこれらのソリューションをしようと、私は修正するために把握することはできません最後のエラーを取得しています次のいずれか

ERROR in ./~/constants-browserify/constants.json 
Module parse failed: /Users/Documents/Twitch/testbot/node_modules/constants-browserify/constants.json Unexpected token (2:12) 
You may need an appropriate loader to handle this file type. 
| { 
| "O_RDONLY": 0, 
| "O_WRONLY": 1, 
| "O_RDWR": 2, 
@ ./src/js/reducers/chat.js 1:0-50 
@ ./src/js/script.js 
@ multi main 

：First、Second

これは私が取得していますエラーがありますこれは、エラー

import {CHAT_MESSAGE_RECEIVED} from 'constants'; 

const chatReducer = (state = [], action) => { 
    switch(action.type){ 
    case CHAT_MESSAGE_RECEIVED: 
    console.log(state, action); 
    return [...state, action.payload]; 

    default: 
    return state; 
    } 
}; 

export default chatReducer; 

に記載されている減速がある

// changed some loader syntax after reading 
// https://webpack.js.org/how-to/upgrade-from-webpack-1/ 

const path = require(`path`); 

const webpack = require(`webpack`); 
const {UglifyJsPlugin} = webpack.optimize; 

const CopyWebpackPlugin = require(`copy-webpack-plugin`); 
const ExtractTextWebpackPlugin = require(`extract-text-webpack-plugin`); 
const configHtmls = require(`webpack-config-htmls`)(); 

const extractCSS = new ExtractTextWebpackPlugin(`css/style.css`); 

// change for production build on different server path 
const publicPath = `/`; 

// hard copy assets folder for: 
// - srcset images (not loaded through html-loader) 
// - json files (through fetch) 
// - fonts via WebFontLoader 

const copy = new CopyWebpackPlugin([{ 
    from: `./src/assets`, 
    to: `assets` 
}], { 
    ignore: [ `.DS_Store` ] 
}); 

const config = { 

    entry: [ 
    `./src/css/style.css`, 
    `./src/js/script.js` 
    ], 

    resolve: { 
    // import files without extension import ... from './Test' 
    extensions: [`.js`, `.jsx`, `.css`] 
    }, 

    output: { 
    path: path.join(__dirname, `server`, `public`), 
    filename: `js/[name].[hash].js`, 
    publicPath 
    }, 

    devtool: `sourcemap`, 

    module: { 

    rules: [ 
     { 
     test: /\.css$/, 
     loader: extractCSS.extract([ 
      { 
      loader: `css`, 
      options: { 
       importLoaders: 1 
      } 
      }, 
      { 
      loader: `postcss` 
      } 
     ]) 
     }, 
     { 
     test: /\.html$/, 
     loader: `html`, 
     options: { 
      attrs: [ 
      `audio:src`, 
      `img:src`, 
      `video:src`, 
      `source:srcset` 
      ] // read src from video, img & audio tag 
     } 
     }, 
     { 
     test: /\.(jsx?)$/, 
     exclude: /node_modules/, 
     use: [ 
      { 
      loader: `babel` 
      }, 
      { 
      loader: `eslint`, 
      options: { 
       fix: true 
      } 
      } 
     ] 
     }, 
     { 
     test: /\.(svg|png|jpe?g|gif|webp)$/, 
     loader: `url`, 
     options: { 
      limit: 1000, // inline if < 1 kb 
      context: `./src`, 
      name: `[path][name].[ext]` 
     } 
     }, 
     { 
     test: /\.(mp3|mp4)$/, 
     loader: `file`, 
     options: { 
      context: `./src`, 
      name: `[path][name].[ext]` 
     } 
     } 
    ] 

    }, 

    plugins: [ 
    extractCSS, 
    copy 
    ] 

}; 

if(process.env.NODE_ENV === `production`){ 

    //image optimizing 
    config.module.rules.push({ 
    test: /\.(svg|png|jpe?g|gif)$/, 
    loader: `image-webpack`, 
    enforce: `pre` 
    }); 

    config.plugins = [ 
    ...config.plugins, 
    new UglifyJsPlugin({ 
     sourceMap: true, // false returns errors.. -p + plugin conflict 
     comments: false 
    }) 
    ]; 

} 

config.plugins = [...config.plugins, ...configHtmls.plugins]; 

module.exports = config; 

：そして、これは私のwebpack.config.jsです

このエラーを修正するために私が間違っていることについて何か考えてみませんか？

Answer 1

パスが「定数」のファイルをインポートしましたが、このパスはnode_modulesのconstant-browserifyフォルダに干渉していました。

定数のファイル名とパスを変更することで、私はエラーを修正しました。