Hi guys, I update the webpack to beta.23, when I run it in development every thing fine, but once I run it in production, the error occurs:
Refused to execute script from ‘http://127.0.0.1:8080/dist/vendor.30ac4c9b26b20f70918e.js‘ because its MIME type (‘text/html’) is not executable, and strict MIME type checking is enabled.
I don’t know why, anyone has idea for this?
Here’s my webpack config :
/* eslint-disable */
var path = require('path');
var webpack = require('webpack');
var autoprefixer = require('autoprefixer');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var StyleLintPlugin = require('stylelint-webpack-plugin');
var nodeEnv = process.env.NODE_ENV || 'development';
var isDev = nodeEnv !== 'production';
var WebpackIsomorphicToolsPlugin = require('webpack-isomorphic-tools/plugin');
var webpackIsomorphicToolsPlugin = new WebpackIsomorphicToolsPlugin(require('./webpack-isomorphic-tools.config')).development(isDev);
// Setting the plugins for development/prodcution
function getPlugins() {
var plugins = [];
plugins.push(
// Setup global variables for app
new webpack.DefinePlugin({
'process.env': { NODE_ENV: JSON.stringify(nodeEnv) },
__CLIENT__: JSON.stringify(true),
__SERVER__: JSON.stringify(false),
__DEV__: JSON.stringify(isDev),
}),
// Style lint
new StyleLintPlugin({
syntax: 'scss',
failOnError: styleLintFailOnError,
}),
new webpack.NoErrorsPlugin(),
webpackIsomorphicToolsPlugin
);
var eslintFailOnError = true; // Disable js lint error terminating here
var styleLintFailOnError = true; // Disable style lint error terminating here
var postcssParams = [autoprefixer({ browsers: ['last 2 versions'] })];
if (isDev) {
plugins.push(
new webpack.LoaderOptionsPlugin({
options: {
eslint: {
failOnError: eslintFailOnError,
},
postcss: postcssParams,
debug: true,
}
}),
new webpack.IgnorePlugin(/webpack-stats\.json$/),
new webpack.HotModuleReplacementPlugin()
);
} else {
plugins.push(
new webpack.LoaderOptionsPlugin({
options: {
eslint: {
failOnError: eslintFailOnError,
},
postcss: postcssParams,
debug: false,
minimize: true,
}
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
filename: '[name].[chunkhash].js',
minChunks: Infinity,
}),
new ExtractTextPlugin({ filename: '[name].[chunkhash].css', allChunks: true }),
new webpack.optimize.UglifyJsPlugin({
compress: { screw_ie8: true, warnings: false },
output: { comments: false },
sourceMap: false,
}),
new webpack.optimize.OccurrenceOrderPlugin(true),
new webpack.optimize.DedupePlugin()
);
}
return plugins;
}
// Setting the entry for development/prodcution
function getEntry() {
var entry;
if (isDev) {
entry = {
app: [
'webpack-hot-middleware/client',
'react-hot-loader/patch',
'./src/client.js',
],
};
} else {
entry = {
app: './src/client.js',
// Register vendors here
vendor: [
'babel-polyfill',
'react', 'react-dom', 'react-addons-shallow-compare',
'redux', 'react-redux',
'redux-thunk',
'immutable',
'redux-immutable',
'react-router',
'react-router-redux',
'react-helmet',
'axios',
],
};
}
return entry;
}
// Setting webpack settings
module.exports = function (CSSModules) {
return {
cache: isDev,
// debug: isDev,
devtool: isDev ? 'cheap-module-eval-source-map' : 'hidden-source-map',
context: path.join(__dirname, '../..'),
entry: getEntry(),
output: {
path: path.join(__dirname, '../../public/dist'),
publicPath: '/dist/',
filename: isDev ? '[name].[hash].js' : '[name].[chunkhash].js',
chunkFilename: '[name].[chunkhash].js',
},
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loaders: ['babel', 'eslint'],
query: {
cacheDirectory: isDev,
},
},
{ test: /\.json$/, loader: 'json' },
{
test: /\.css$/,
loader: isDev ?
'style!css?localIdentName=[name]__[local].[hash:base64:5]&' + (CSSModules ? 'modules' : '') + '&sourceMap&-minimize&importLoaders=1!postcss'
: ExtractTextPlugin.extract({ fallbackLoader: 'style', loader: 'css?' + (CSSModules ? 'modules' : '') + '&sourceMap&importLoaders=1!postcss' }),
},
{
test: /\.scss$/,
loader: isDev ?
'style!css?localIdentName=[name]__[local].[hash:base64:5]&' + (CSSModules ? 'modules' : '') + '&sourceMap&-minimize&importLoaders=2!postcss!sass?outputStyle=expanded&sourceMap'
: ExtractTextPlugin.extract({ fallbackLoader: 'style', loader: 'css?' + (CSSModules ? 'modules' : '') + '&sourceMap&importLoaders=2!postcss!sass?outputStyle=expanded&sourceMap&sourceMapContents' }),
},
{ test: /\.woff(2)?(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/font-woff' },
{ test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/octet-stream' },
{ test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file' },
{ test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml' },
{
test: webpackIsomorphicToolsPlugin.regular_expression('images'),
// Any image below or equal to 10K will be converted to inline base64 instead
loaders: [
'url?limit=10240',
'image-webpack?bypassOnDebug', // Using for image optimization
],
},
],
},
resolve: {
extensions: ['.js', '.jsx', '.json'],
modules: [
'src',
'node_modules',
],
},
plugins: getPlugins(),
};
};
Hello @sokra,
I fixing it by remove the ‘eslint-loader’ from my config, close this issue.