Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
use: [
cacheLoader,
{
loader: "babel-loader",
options: {
...(isProduction ? productionBabelOptions : developmentBabelOptions),
babelrc: false
}
}
].filter(Boolean)
},
// Use either
{
test: postcssFiles,
use: isClient ? ExtractCssChunks.extract({
use: [
cacheLoader,
{
loader: "css-loader",
options: cssLoaderOptions
},
postCSSLoaderRule
].filter(Boolean)
}) : [
cacheLoader,
{
loader: "css-loader/locals",
options: cssLoaderOptions
},
postCSSLoaderRule
].filter(Boolean)
}
]
]
}
}
},
// remove above babel-loader and uncomment this if you are rendering the
// server with Babel and not using "css-modules-transform" in .babelrc:
// {
// test: /\.js$/,
// exclude: /node_modules/,
// use: 'babel-loader',
// },
{
test: /\.css$/,
use: ExtractCssChunks.extract({
use: 'css-loader?modules&localIdentName=[name]__[local]--[hash:base64:5]'
})
}
]
},
plugins: [
new ExtractCssChunks(),
new webpack.HashedModuleIdsPlugin(), // only needed when server built with webpack
new webpack.optimize.CommonsChunkPlugin({
names: ['bootstrap'], // needed to put webpack bootstrap code before chunks
filename: '[name].[chunkhash].js',
minChunks: Infinity
}),
new StatsPlugin('stats.json'),
new webpack.DefinePlugin({
output: {
filename: '[name].js',
chunkFilename: '[name].js',
path: path.resolve(__dirname, '../buildClient'),
publicPath: '/static/'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.css$/,
use: ExtractCssChunks.extract({
use: {
loader: 'css-loader',
options: {
modules: true,
localIdentName: '[name]__[local]--[hash:base64:5]'
}
}
})
}
]
},
resolve: {
extensions: ['.js', '.css']
},
plugins: [
new WriteFilePlugin(), // used so you can see what chunks are produced in dev
}
]
]
}
}
},
// remove above and uncomment this if you are not using
// "css-modules-transform" in .babelrc:
// {
// test: /\.js$/,
// exclude: /node_modules/,
// use: 'babel-loader',
// },
{
test: /\.css$/,
use: ExtractCssChunks.extract({
use: 'css-loader?modules&localIdentName=[name]__[local]--[hash:base64:5]'
})
}
]
},
plugins: [
new ExtractCssChunks(),
new webpack.NamedModulesPlugin(), // only needed when server built with webpack
new webpack.optimize.CommonsChunkPlugin({
names: ['bootstrap'], // needed to put webpack bootstrap code before chunks
filename: '[name].js',
minChunks: Infinity
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
// REQUIRED: webpackHotServerMiddleware is expecting two webpack configs,
// one with a name 'client', one with a name 'server'.
name: 'client',
// Target browsers for our client config
target: 'web',
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.css$/,
// REQUIRED: Extract css files into their own chunks
use: ExtractCssChunks.extract({
use: 'css-loader'
})
}
]
},
devtool: 'eval',
entry: path.resolve(__dirname, '../src/index.js'),
output: {
// REQUIRED: file and chunk names should match
filename: '[name].js',
chunkFilename: '[name].js',
// REQUIRED: where to write files to
path: path.resolve(__dirname, '../buildClient'),
// REQUIRED: where files will be served from
publicPath: '/static/'
},
].filter(Boolean),
})
: [
cacheLoaderRule,
{
loader: require.resolve('css-loader/locals'),
options: cssLoaderOptions,
},
postCSSLoaderRule,
].filter(Boolean),
},
{
test: /\.scss$/,
include: SRC_DIR,
use: _IS_CLIENT_
? ExtractCssChunks.extract({
use: [
cacheLoaderRule,
{
loader: require.resolve('css-loader'),
options: cssLoaderSassOptions,
},
postCSSLoaderRule,
sassLoaderRule,
].filter(Boolean),
})
: [
cacheLoaderRule,
{
loader: require.resolve('css-loader/locals'),
options: cssLoaderSassOptions,
},
const CLIENT_LOADERS = (env)=>{
let loader = [
{ test: /\.tsx?$/, exclude: /node_modules/, loader: "awesome-typescript-loader" ,
options: {
sourceMap: true,
useCache: true,
useBabel: false
}
},
{
test: /\.css$/,
use: ExtractCssChunks.extract({
use: {
loader: 'css-loader',
options: {
modules: true,
localIdentName: '[name]__[local]--[hash:base64:5]'
}
}
})
}
]
return {rules:loader}
};
publicPath: __PWA_PUBLIC_PATH__,
filename: isProd ? 'js/[name].[chunkhash:8].js' : 'js/[name].js',
chunkFilename: isProd ? 'js/[name].[chunkhash:8].js' : 'js/[name].js',
},
resolve: {
alias: {
react: 'preact-compat',
'react-dom': 'preact-compat',
},
},
module: {
rules: isProd ? [
{ test: /\.js$/, exclude: /node_modules/, use: ['babel-loader'] },
{ test: /\.css$/, loader: ExtractCssChunks.extract({ use: [{ loader: 'css-loader', options: { importLoaders: 1 } }, 'postcss-loader'] }) },
{ test: /\.(gif|png|jpe?g|svg|ico)$/i, use: [{ loader: 'file-loader', options: { name: 'images/[name].[hash:8].[ext]' } }] },
{ test: /\.(woff(2)?|ttf|otf|eot)(\?[a-z0-9=&.]+)?$/, use: [{ loader: 'url-loader', options: { limit: 1000, name: 'fonts/[name].[hash:8].[ext]' } }] },
] : [
{ test: /\.js$/, exclude: /node_modules/, use: ['babel-loader'] },
{ test: /\.css$/, use: ['style-loader', { loader: 'css-loader', options: { importLoaders: 1 } }, 'postcss-loader'] },
{ test: /\.(gif|png|jpe?g|svg|ico)$/i, use: [{ loader: 'file-loader', options: { name: 'images/[name].[ext]' } }] },
{ test: /\.(woff(2)?|ttf|otf|eot)(\?[a-z0-9=&.]+)?$/, use: [{ loader: 'url-loader', options: { limit: 1000, name: 'fonts/[name].[ext]' } }] },
],
},
plugins: [
new webpack.NoEmitOnErrorsPlugin(),
new CleanWebpackPlugin(['./build/client']),
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
new webpack.DefinePlugin({
'process.env.NODE_ENV': isProd ? '"production"' : '"development"',
output: {
filename: '[name].js',
chunkFilename: '[name].js',
path: path.resolve(__dirname, '../buildClient'),
publicPath: '/static/'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.styl$/,
use: ExtractCssChunks.extract({
use: [
{
loader: 'css-loader',
options: {
modules: true,
localIdentName: '[name]__[local]--[hash:base64:5]'
}
},
{
loader: 'stylus-loader'
}
]
})
}
]
},
output: {
filename: '[name].[chunkhash].js',
chunkFilename: '[name].[chunkhash].js',
path: path.resolve(__dirname, '../buildClient'),
publicPath: '/static/'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.css$/,
use: ExtractCssChunks.extract({
use: {
loader: 'css-loader',
options: {
modules: true,
localIdentName: '[name]__[local]--[hash:base64:5]'
}
}
})
}
]
},
resolve: {
extensions: ['.js', '.css']
},
plugins: [
new StatsPlugin('stats.json'),