You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

147 lines
4.5 KiB

const htmlLoader = require('neutrino-middleware-html-loader');
const styleLoader = require('neutrino-middleware-style-loader');
const fontLoader = require('neutrino-middleware-font-loader');
const imageLoader = require('neutrino-middleware-image-loader');
const compileLoader = require('neutrino-middleware-compile-loader');
const env = require('neutrino-middleware-env');
const htmlTemplate = require('neutrino-middleware-html-template');
const chunk = require('neutrino-middleware-chunk');
const hot = require('neutrino-middleware-hot');
const copy = require('neutrino-middleware-copy');
const progress = require('neutrino-middleware-progress');
const clean = require('neutrino-middleware-clean');
const minify = require('neutrino-middleware-minify');
const loaderMerge = require('neutrino-middleware-loader-merge');
const namedModules = require('neutrino-middleware-named-modules');
const { join } = require('path');
const { pathOr } = require('ramda');
const MODULES = join(__dirname, 'node_modules');
function devServer({ config }, options) {
config.devServer
.host(options.host)
.port(parseInt(options.port, 10))
.https(options.https)
.contentBase(options.contentBase)
.historyApiFallback(true)
.hot(true)
.stats({
assets: false,
children: false,
chunks: false,
colors: true,
errors: true,
errorDetails: true,
hash: false,
modules: false,
publicPath: false,
timings: false,
version: false,
warnings: true
});
}
module.exports = (neutrino) => {
const { config } = neutrino;
neutrino.use(env);
neutrino.use(htmlLoader);
neutrino.use(styleLoader);
neutrino.use(fontLoader);
neutrino.use(imageLoader);
neutrino.use(htmlTemplate, neutrino.options.html);
neutrino.use(namedModules);
neutrino.use(compileLoader, {
include: [neutrino.options.source, neutrino.options.tests],
babel: {
plugins: [require.resolve('babel-plugin-syntax-dynamic-import')],
presets: [
[require.resolve('babel-preset-env'), {
modules: false,
useBuiltIns: true,
include: ['transform-regenerator'],
targets: pathOr({
browsers: [
'last 2 Chrome versions',
'last 2 Firefox versions',
'last 2 Edge versions',
'last 2 Opera versions',
'last 2 Safari versions',
'last 2 iOS versions'
]
}, ['options', 'compile', 'targets'], neutrino)
}]
]
}
});
if (process.env.NODE_ENV !== 'test') {
neutrino.use(chunk);
}
config
.target('web')
.context(neutrino.options.root)
.entry('index')
.add(require.resolve('babel-polyfill'))
.add(neutrino.options.entry);
config.output
.path(neutrino.options.output)
.publicPath('./')
.filename('[name].bundle.js')
.chunkFilename('[id].[chunkhash].js');
config.resolve.modules.add(neutrino.options.node_modules).add(MODULES);
config.resolve.extensions.add('.js').add('.json');
config.resolveLoader.modules.add(neutrino.options.node_modules).add(MODULES);
config.node
.set('console', false)
.set('global', true)
.set('process', true)
.set('Buffer', true)
.set('__filename', 'mock')
.set('__dirname', 'mock')
.set('setImmediate', true)
.set('fs', 'empty')
.set('tls', 'empty');
if (config.module.rules.has('lint')) {
neutrino.use(loaderMerge('lint', 'eslint'), {
globals: ['Buffer'],
envs: ['browser', 'commonjs']
});
}
if (process.env.NODE_ENV === 'development') {
const protocol = process.env.HTTPS ? 'https' : 'http';
const host = process.env.HOST || pathOr('localhost', ['options', 'config', 'devServer', 'host'], neutrino);
const port = process.env.PORT || pathOr(5000, ['options', 'config', 'devServer', 'port'], neutrino);
neutrino.use(hot);
neutrino.use(devServer, {
host,
port,
https: pathOr(protocol === 'https', ['options', 'config', 'devServer', 'https'], neutrino),
contentBase: neutrino.options.source
});
config
Should generate correct sourcemaps during dev The current [devtool](https://webpack.js.org/configuration/devtool/) configuration of `eval` makes it very difficult to debug your source code when running the development command `neutrino start`. I did some digging and there is an issue with sourcemaps and Webpack 2. See https://github.com/webpack/webpack/issues/3165 and https://github.com/webpack/webpack/issues/4423 for more information. In the meantime, it would be great if the default setting for the development command `neutrino start` would generate correct sourcemaps with a reference to the original source and allow you to set breakpoints correctly. I did some tests in OS X Chrome v56.0.2924.87 (64-bit) by trying different [devtool](https://webpack.js.org/configuration/devtool/) configurations in a custom neutrino config that extends `neutrino-preset-web`. * `eval`: reports correct line in transformed code, and breakpoints work, but difficult to debug * `cheap-eval-source-map`: reports incorrect line in transformed code, breakpoints can be added, but are on incorrect line and don't work * `cheap-source-map`: reports incorrect line in transformed code, breakpoints work, but are on incorrect line * `cheap-module-eval-source-map`: reports incorrect line in source, breakpoints can be added, but are on incorrect line and don't work * `cheap-module-source-map`: reports incorrect line in source, breakpoints work, but are on incorrect line * `eval-source-map`: reports correct line in source, but breakpoints don't work * `source-map`: reports correct line in source, and breakpoints work * `nosources-source-map`: reports correct line in source, but no source is generated If you are just running `neutrino-preset-web` out of the box you should be able to debug your code easily. Making this change can cause slower rebuilds, but I'd be willing to wait a few 100ms (or whatever `--` means in time) to rebuild my code for better debugging. If and when the above Webpack 2 issues are fixed, I would suggest revisiting the `devtool` option by changing it to `cheap-module-eval-source-map` or `eval-source-map` for speedier rebuilds with sourcemaps that point to source code vs transpiled code.
8 years ago
.devtool('source-map')
.entry('index')
.add(`webpack-dev-server/client?${protocol}://${host}:${port}/`)
.add('webpack/hot/dev-server');
} else {
neutrino.use(clean, { paths: [neutrino.options.output] });
neutrino.use(progress);
neutrino.use(minify);
neutrino.use(copy, {
patterns: [{ context: neutrino.options.source, from: '**/*' }],
options: { ignore: ['*.js*'] }
});
config.output.filename('[name].[chunkhash].bundle.js');
}
};