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.
1006 lines
40 KiB
1006 lines
40 KiB
|
|
<!DOCTYPE HTML>
|
|
<html lang="" >
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
|
|
<title>Advanced · Neutrino</title>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="description" content="">
|
|
<meta name="generator" content="GitBook 3.2.2">
|
|
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../gitbook/style.css">
|
|
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../gitbook/gitbook-plugin-prism/prism.css">
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../gitbook/gitbook-plugin-npmsearchlist/styles.css">
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../gitbook/gitbook-plugin-search/search.css">
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../gitbook/gitbook-plugin-fontsettings/website.css">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<meta name="HandheldFriendly" content="true"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
|
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="../gitbook/images/apple-touch-icon-precomposed-152.png">
|
|
<link rel="shortcut icon" href="../gitbook/images/favicon.ico" type="image/x-icon">
|
|
|
|
|
|
<link rel="next" href="../creating-presets.html" />
|
|
|
|
|
|
<link rel="prev" href="simple.html" />
|
|
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<div class="book">
|
|
<div class="book-summary">
|
|
|
|
|
|
<div id="book-search-input" role="search">
|
|
<input type="text" placeholder="Type to search" />
|
|
</div>
|
|
|
|
|
|
<nav role="navigation">
|
|
|
|
|
|
|
|
<ul class="summary">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li class="chapter " data-level="1.1" data-path="../">
|
|
|
|
<a href="../">
|
|
|
|
|
|
Introduction
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.2" data-path="../installation.html">
|
|
|
|
<a href="../installation.html">
|
|
|
|
|
|
Installation
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.3" data-path="../usage.html">
|
|
|
|
<a href="../usage.html">
|
|
|
|
|
|
Usage
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.4" data-path="../project-layout.html">
|
|
|
|
<a href="../project-layout.html">
|
|
|
|
|
|
Project Layout
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.5" data-path="../FAQ.html">
|
|
|
|
<a href="../FAQ.html">
|
|
|
|
|
|
FAQ
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6" data-path="../presets/">
|
|
|
|
<a href="../presets/">
|
|
|
|
|
|
Presets
|
|
|
|
</a>
|
|
|
|
|
|
|
|
<ul class="articles">
|
|
|
|
|
|
<li class="chapter " data-level="1.6.1" data-path="../presets/neutrino-preset-web/">
|
|
|
|
<a href="../presets/neutrino-preset-web/">
|
|
|
|
|
|
Web
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6.2" data-path="../presets/neutrino-preset-react/">
|
|
|
|
<a href="../presets/neutrino-preset-react/">
|
|
|
|
|
|
React
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6.3" data-path="../presets/neutrino-preset-node/">
|
|
|
|
<a href="../presets/neutrino-preset-node/">
|
|
|
|
|
|
Node.js
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6.4" data-path="../presets/neutrino-preset-airbnb-base/">
|
|
|
|
<a href="../presets/neutrino-preset-airbnb-base/">
|
|
|
|
|
|
Airbnb
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6.5" data-path="../presets/neutrino-preset-karma/">
|
|
|
|
<a href="../presets/neutrino-preset-karma/">
|
|
|
|
|
|
Karma
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6.6" data-path="../presets/neutrino-preset-mocha/">
|
|
|
|
<a href="../presets/neutrino-preset-mocha/">
|
|
|
|
|
|
Mocha
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6.7" data-path="../presets/neutrino-preset-jest/">
|
|
|
|
<a href="../presets/neutrino-preset-jest/">
|
|
|
|
|
|
Jest
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.6.8" data-path="../presets/community-presets.html">
|
|
|
|
<a href="../presets/community-presets.html">
|
|
|
|
|
|
Community presets
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7" data-path="../middleware/">
|
|
|
|
<a href="../middleware/">
|
|
|
|
|
|
Middleware
|
|
|
|
</a>
|
|
|
|
|
|
|
|
<ul class="articles">
|
|
|
|
|
|
<li class="chapter " data-level="1.7.1" data-path="../middleware/neutrino-middleware-banner/">
|
|
|
|
<a href="../middleware/neutrino-middleware-banner/">
|
|
|
|
|
|
banner
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.2" data-path="../middleware/neutrino-middleware-chunk/">
|
|
|
|
<a href="../middleware/neutrino-middleware-chunk/">
|
|
|
|
|
|
chunk
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.3" data-path="../middleware/neutrino-middleware-clean/">
|
|
|
|
<a href="../middleware/neutrino-middleware-clean/">
|
|
|
|
|
|
clean
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.4" data-path="../middleware/neutrino-middleware-compile-loader/">
|
|
|
|
<a href="../middleware/neutrino-middleware-compile-loader/">
|
|
|
|
|
|
compile-loader
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.5" data-path="../middleware/neutrino-middleware-copy/">
|
|
|
|
<a href="../middleware/neutrino-middleware-copy/">
|
|
|
|
|
|
copy
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.6" data-path="../middleware/neutrino-middleware-env/">
|
|
|
|
<a href="../middleware/neutrino-middleware-env/">
|
|
|
|
|
|
env
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.7" data-path="../middleware/neutrino-middleware-eslint/">
|
|
|
|
<a href="../middleware/neutrino-middleware-eslint/">
|
|
|
|
|
|
eslint
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.8" data-path="../middleware/neutrino-middleware-font-loader/">
|
|
|
|
<a href="../middleware/neutrino-middleware-font-loader/">
|
|
|
|
|
|
font-loader
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.9" data-path="../middleware/neutrino-middleware-hot/">
|
|
|
|
<a href="../middleware/neutrino-middleware-hot/">
|
|
|
|
|
|
hot
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.10" data-path="../middleware/neutrino-middleware-html-loader/">
|
|
|
|
<a href="../middleware/neutrino-middleware-html-loader/">
|
|
|
|
|
|
html-loader
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.11" data-path="../middleware/neutrino-middleware-html-template/">
|
|
|
|
<a href="../middleware/neutrino-middleware-html-template/">
|
|
|
|
|
|
html-template
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.12" data-path="../middleware/neutrino-middleware-image-loader/">
|
|
|
|
<a href="../middleware/neutrino-middleware-image-loader/">
|
|
|
|
|
|
image-loader
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.13" data-path="../middleware/neutrino-middleware-loader-merge/">
|
|
|
|
<a href="../middleware/neutrino-middleware-loader-merge/">
|
|
|
|
|
|
loader-merge
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.14" data-path="../middleware/neutrino-middleware-minify/">
|
|
|
|
<a href="../middleware/neutrino-middleware-minify/">
|
|
|
|
|
|
minify
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.15" data-path="../middleware/neutrino-middleware-named-modules/">
|
|
|
|
<a href="../middleware/neutrino-middleware-named-modules/">
|
|
|
|
|
|
named-modules
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.16" data-path="../middleware/neutrino-middleware-named-start-server/README.md">
|
|
|
|
<span>
|
|
|
|
|
|
start-server
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.7.17" data-path="../middleware/neutrino-middleware-named-style-loader/README.md">
|
|
|
|
<span>
|
|
|
|
|
|
style-loader
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.8" data-path="./">
|
|
|
|
<a href="./">
|
|
|
|
|
|
Customization
|
|
|
|
</a>
|
|
|
|
|
|
|
|
<ul class="articles">
|
|
|
|
|
|
<li class="chapter " data-level="1.8.1" data-path="simple.html">
|
|
|
|
<a href="simple.html">
|
|
|
|
|
|
Simple
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter active" data-level="1.8.2" data-path="advanced.html">
|
|
|
|
<a href="advanced.html">
|
|
|
|
|
|
Advanced
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.9" data-path="../creating-presets.html">
|
|
|
|
<a href="../creating-presets.html">
|
|
|
|
|
|
Creating presets
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.10" data-path="../learning-resources.html">
|
|
|
|
<a href="../learning-resources.html">
|
|
|
|
|
|
Learning Resources
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.11" data-path="../api/">
|
|
|
|
<a href="../api/">
|
|
|
|
|
|
API
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.12" data-path="../cli/">
|
|
|
|
<a href="../cli/">
|
|
|
|
|
|
CLI
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.13" data-path="../upgrading-neutrino.html">
|
|
|
|
<a href="../upgrading-neutrino.html">
|
|
|
|
|
|
Upgrading from v4 to v5
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.14" >
|
|
|
|
<a target="_blank" href="https://github.com/mozilla-neutrino/neutrino-dev/tree/docs-v4/docs">
|
|
|
|
|
|
v4 Documentation
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.15" data-path="../contributing/">
|
|
|
|
<a href="../contributing/">
|
|
|
|
|
|
Contributing
|
|
|
|
</a>
|
|
|
|
|
|
|
|
<ul class="articles">
|
|
|
|
|
|
<li class="chapter " data-level="1.15.1" data-path="../contributing/development.html">
|
|
|
|
<a href="../contributing/development.html">
|
|
|
|
|
|
Development Process
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
<li class="chapter " data-level="1.15.2" data-path="../contributing/code-of-conduct.html">
|
|
|
|
<a href="../contributing/code-of-conduct.html">
|
|
|
|
|
|
Code of Conduct
|
|
|
|
</a>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
<li class="divider"></li>
|
|
|
|
<li>
|
|
<a href="https://www.gitbook.com" target="blank" class="gitbook-link">
|
|
Published with GitBook
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
|
|
|
|
</nav>
|
|
|
|
|
|
</div>
|
|
|
|
<div class="book-body">
|
|
|
|
<div class="body-inner">
|
|
|
|
|
|
|
|
<div class="book-header" role="navigation">
|
|
|
|
|
|
<!-- Title -->
|
|
<h1>
|
|
<i class="fa fa-circle-o-notch fa-spin"></i>
|
|
<a href=".." >Advanced</a>
|
|
</h1>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="page-wrapper" tabindex="-1" role="main">
|
|
<div class="page-inner">
|
|
|
|
<div id="book-search-results">
|
|
<div class="search-noresults">
|
|
|
|
<section class="normal markdown-section">
|
|
|
|
<h1 id="advanced-neutrino-customization">Advanced Neutrino Customization</h1>
|
|
<p>No two JavaScript projects are ever the same, and as such there may be times when you will need to make modifications
|
|
to the way your Neutrino preset is building your project. If you need more customization than can be afforded by
|
|
augmenting your project's package.json, consider using this advanced configuration guide to modify your build as
|
|
needed.</p>
|
|
<h2 id="creating-a-project-specific-override">Creating a project-specific override</h2>
|
|
<p>Neutrino configurations are backed by <a href="https://github.com/mozilla-neutrino/webpack-chain" target="_blank">webpack-chain</a>, a library for
|
|
making modifications to a Webpack configuration using a fluent or chained API. When your project needs more advanced
|
|
build overrides, you will be interacting with this API in order to perform modifications.</p>
|
|
<p>First, we need to create a project-specific override to make these changes. This can either be a JS file or a directory
|
|
with an <code>index.js</code> file. Since Neutrino uses Node.js and Webpack for interacting with presets, it is helpful to
|
|
understand that this is a Node.js module. By exporting a middleware function from your module, you will be provided with
|
|
a Neutrino instance for modifying the build. Let's create a file called <code>override.js</code> in the root of our example
|
|
project:</p>
|
|
<pre class="language-"><code class="lang-js"><span class="token comment" spellcheck="true">// override.js</span>
|
|
module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
<span class="token comment" spellcheck="true">// ...</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<p>The signature of this function is what we call "Neutrino middleware". If you're familiar with middleware from the
|
|
Express/connect world, this works similarly. When using Express middleware, you provide a function to Express which
|
|
receives arguments to modify a request or response along its lifecycle. There can be a number of middleware functions
|
|
that Express can load, each one potentially modifying a request or response in succession.</p>
|
|
<p>When you customize Neutrino with an override, you export a Neutrino middleware function, except this is typically used
|
|
to override Neutrino's configuration. Every preset or middleware that Neutrino has loaded follows this same middleware
|
|
pipeline.</p>
|
|
<p>At the moment our custom override isn't doing anything, but it does get us far enough to be able to tell Neutrino
|
|
to use it for additional configuration. Modify your package.json and add <code>override.js</code> as an additional preset.</p>
|
|
<p><em>Note: Neutrino will attempt to load this module relative to the current working directory, which should be the root of
|
|
your project.</em></p>
|
|
<pre class="language-"><code class="lang-json"><span class="token punctuation">{</span>
|
|
<span class="token property">"neutrino"</span><span class="token operator">:</span> <span class="token punctuation">{</span>
|
|
<span class="token property">"use"</span><span class="token operator">:</span> <span class="token punctuation">[</span>
|
|
<span class="token string">"neutrino-preset-react"</span><span class="token punctuation">,</span>
|
|
<span class="token string">"neutrino-preset-karma"</span><span class="token punctuation">,</span>
|
|
<span class="token string">"override.js"</span>
|
|
<span class="token punctuation">]</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">,</span>
|
|
<span class="token property">"scripts"</span><span class="token operator">:</span> <span class="token punctuation">{</span>
|
|
<span class="token property">"build"</span><span class="token operator">:</span> <span class="token string">"neutrino build"</span>
|
|
<span class="token punctuation">}</span>
|
|
<span class="token punctuation">}</span>
|
|
</code></pre>
|
|
<p>Other than actually changing the build configuration or Neutrino options, that is all the setup necessary for Neutrino
|
|
to pick up your custom changes.</p>
|
|
<h2 id="overriding-neutrino-options">Overriding Neutrino options</h2>
|
|
<p>Neutrino has a number of useful options for customizing its behavior, as well as the behavior of presets and middleware.
|
|
You can override these options using an object at <code>neutrino.options</code>.</p>
|
|
<p><strong>Important! Some of these options are used by presets and middleware to determine their path locations for building.
|
|
Making changes to these in advanced configuration will usually mean needing to set Neutrino options before other presets
|
|
are loaded, and overriding build configuration after the presets have loaded. Consider using
|
|
<a href="simple.html">simple customization</a> for setting Neutrino options and preset/middleware-specific options.</strong></p>
|
|
<h3 id="optionsroot"><code>options.root</code></h3>
|
|
<p>Set the base directory which Neutrino middleware and presets operate on. Typically this is the project directory where
|
|
the package.json would be located. If the option is not set, Neutrino defaults it to <code>process.cwd()</code>. If a relative
|
|
path is specified, it will be resolved relative to <code>process.cwd()</code>; absolute paths will be used as-is.</p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
<span class="token comment" spellcheck="true">// if not specified, defaults to process.cwd()</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>root<span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// relative, resolves to process.cwd() + ./website</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>root <span class="token operator">=</span> <span class="token string">'./website'</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// absolute</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>root <span class="token operator">=</span> <span class="token string">'/code/website'</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<h3 id="optionssource"><code>options.source</code></h3>
|
|
<p>Set the directory which contains the application source code. If the option is not set, Neutrino defaults it to <code>src</code>.
|
|
If a relative path is specified, it will be resolved relative to <code>options.root</code>; absolute paths will be used as-is.</p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
<span class="token comment" spellcheck="true">// if not specified, defaults to options.root + src</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>source<span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// relative, resolves to options.root + ./lib</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>source <span class="token operator">=</span> <span class="token string">'./lib'</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// absolute</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>source <span class="token operator">=</span> <span class="token string">'/code/website/lib'</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<h3 id="optionsoutput"><code>options.output</code></h3>
|
|
<p>Set the directory which will be the output of built assets. If the option is not set, Neutrino defaults it to <code>build</code>.
|
|
If a relative path is specified, it will be resolved relative to <code>options.root</code>; absolute paths will be used as-is.</p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
<span class="token comment" spellcheck="true">// if not specified, defaults to options.root + build</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>output<span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// relative, resolves to options.root + ./dist</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>output <span class="token operator">=</span> <span class="token string">'./dist'</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// absolute</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>output <span class="token operator">=</span> <span class="token string">'/code/website/dist'</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<h3 id="optionstests"><code>options.tests</code></h3>
|
|
<p>Set the directory that contains test files. If the option is not set, Neutrino defaults it to <code>test</code>.
|
|
If a relative path is specified, it will be resolved relative to <code>options.root</code>; absolute paths will be used as-is.</p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
<span class="token comment" spellcheck="true">// if not specified, defaults to options.root + test</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>tests<span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// relative, resolves to options.root + ./testing</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>tests <span class="token operator">=</span> <span class="token string">'./testing'</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// absolute</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>tests <span class="token operator">=</span> <span class="token string">'/code/website/testing'</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<h3 id="optionsentry"><code>options.entry</code></h3>
|
|
<p>Set the main entry point for the application. If the option is not set, Neutrino defaults it to <code>index.*</code> - the extension is resolved by Webpack. If a relative path is specified, it will be resolved relative to <code>options.source</code>; absolute paths will be used as-is.</p>
|
|
<p>The main file by default is not required to be in JavaScript format. It also potentially may be JSX, TypeScript or any other preprocessor language. These extensions should be specified in a preset in <code>neutrino.config.resolve.extensions</code>. </p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
<span class="token comment" spellcheck="true">// if not specified, defaults to options.source + index</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>entry<span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// relative, resolves to options.source + ./entry.js</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>entry <span class="token operator">=</span> <span class="token string">'./entry.js'</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// absolute</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>entry <span class="token operator">=</span> <span class="token string">'/code/website/lib/entry.js'</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<h3 id="optionsnodemodules"><code>options.node_modules</code></h3>
|
|
<p>Set the directory which contains the Node.js modules of the project. If the option is not set, Neutrino defaults it to
|
|
<code>node_modules</code>. If a relative path is specified, it will be resolved relative to <code>options.root</code>; absolute paths will be
|
|
used as-is.</p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
<span class="token comment" spellcheck="true">// if not specified, defaults to options.root + node_modules</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>node_modules<span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// relative, resolves to options.root + ./modules</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>node_modules <span class="token operator">=</span> <span class="token string">'./modules'</span><span class="token punctuation">;</span>
|
|
|
|
<span class="token comment" spellcheck="true">// absolute</span>
|
|
neutrino<span class="token punctuation">.</span>options<span class="token punctuation">.</span>node_modules <span class="token operator">=</span> <span class="token string">'/code/website/modules'</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<h3 id="middleware-or-preset-options">Middleware or preset options</h3>
|
|
<p>Some middleware and presets also have their own custom options. Consult the documentation for the package for specific
|
|
details on its customization.</p>
|
|
<h2 id="overriding-build-configuration">Overriding build configuration</h2>
|
|
<p>The Neutrino instance provided to your custom configurator has a <code>config</code> property that is an instance of
|
|
<a href="https://github.com/mozilla-neutrino/webpack-chain" target="_blank">webpack-chain</a>. We won't go in-depth of all the configuration
|
|
possibilities here, but encourage you to check out the documentation for webpack-chain for instruction on your
|
|
particular use case. Just know that you can use webpack-chain to modify any part of the underlying Webpack configuration
|
|
using its API.</p>
|
|
<p>This <code>neutrino.config</code> is an accumulation of all configuration up to this moment. All Neutrino middleware and presets
|
|
interact with and make changes through this config, which is all available to you. For example, if you are using the
|
|
presets <code>neutrino-preset-react</code> and <code>neutrino-preset-karma</code>, any config set can be extended, manipulated, or removed.</p>
|
|
<p><em>Example: Neutrino's React preset adds <code>.jsx</code> as a module extension. Let's remove it.</em></p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
neutrino<span class="token punctuation">.</span>config<span class="token punctuation">.</span>resolve<span class="token punctuation">.</span>extensions<span class="token punctuation">.</span><span class="token keyword">delete</span><span class="token punctuation">(</span><span class="token string">'.jsx'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<p><em>Example: Neutrino's Node.js preset uses <code>babel-preset-env</code> to support Node.js v6.9. Let's change it to support back to
|
|
v4.2. This preset has a rule named "compile" and a loader named "babel".</em></p>
|
|
<pre class="language-"><code class="lang-js">module<span class="token punctuation">.</span>exports <span class="token operator">=</span> neutrino <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
neutrino<span class="token punctuation">.</span>config<span class="token punctuation">.</span>module
|
|
<span class="token punctuation">.</span><span class="token function">rule</span><span class="token punctuation">(</span><span class="token string">'compile'</span><span class="token punctuation">)</span>
|
|
<span class="token punctuation">.</span><span class="token function">use</span><span class="token punctuation">(</span><span class="token string">'babel'</span><span class="token punctuation">)</span>
|
|
<span class="token punctuation">.</span><span class="token function">tap</span><span class="token punctuation">(</span>options <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">{</span>
|
|
options<span class="token punctuation">.</span>presets<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">]</span><span class="token punctuation">.</span>targets<span class="token punctuation">.</span>node <span class="token operator">=</span> <span class="token number">4.2</span><span class="token punctuation">;</span>
|
|
<span class="token keyword">return</span> options<span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
|
<span class="token punctuation">}</span><span class="token punctuation">;</span>
|
|
</code></pre>
|
|
<p>Presets can also have their own custom data in addition to the Neutrino config. See your respective preset for details.
|
|
Again, rather than reiterate the documentation for <a href="https://github.com/mozilla-neutrino/webpack-chain" target="_blank">webpack-chain</a>
|
|
here, please refer to its documentation for all ways you can modify a config instance to solve your use cases.</p>
|
|
|
|
|
|
</section>
|
|
|
|
</div>
|
|
<div class="search-results">
|
|
<div class="has-results">
|
|
|
|
<h1 class="search-results-title"><span class='search-results-count'></span> results matching "<span class='search-query'></span>"</h1>
|
|
<ul class="search-results-list"></ul>
|
|
|
|
</div>
|
|
<div class="no-results">
|
|
|
|
<h1 class="search-results-title">No results matching "<span class='search-query'></span>"</h1>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<a href="simple.html" class="navigation navigation-prev " aria-label="Previous page: Simple">
|
|
<i class="fa fa-angle-left"></i>
|
|
</a>
|
|
|
|
|
|
<a href="../creating-presets.html" class="navigation navigation-next " aria-label="Next page: Creating presets">
|
|
<i class="fa fa-angle-right"></i>
|
|
</a>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<script>
|
|
var gitbook = gitbook || [];
|
|
gitbook.push(function() {
|
|
gitbook.page.hasChanged({"page":{"title":"Advanced","level":"1.8.2","depth":2,"next":{"title":"Creating presets","level":"1.9","depth":1,"path":"creating-presets.md","ref":"./creating-presets.md","articles":[]},"previous":{"title":"Simple","level":"1.8.1","depth":2,"path":"customization/simple.md","ref":"./customization/simple.md","articles":[]},"dir":"ltr"},"config":{"plugins":["edit-link","prism","-highlight","github","anchorjs","npmsearchlist"],"root":"./docs","styles":{"website":"styles/website.css","pdf":"styles/pdf.css","epub":"styles/epub.css","mobi":"styles/mobi.css","ebook":"styles/ebook.css","print":"styles/print.css"},"pluginsConfig":{"prism":{},"github":{"url":"https://github.com/mozilla-neutrino/neutrino-dev/"},"search":{},"lunr":{"maxIndexSize":1000000,"ignoreSpecialCharacters":false},"npmsearchlist":{},"fontsettings":{"theme":"white","family":"sans","size":2},"sharing":{"facebook":true,"twitter":true,"google":false,"weibo":false,"instapaper":false,"vk":false,"all":["facebook","google","twitter","weibo","instapaper"]},"edit-link":{"label":"Edit page","base":"https://github.com/mozilla-neutrino/neutrino-dev/tree/master/docs"},"theme-default":{"styles":{"website":"styles/website.css","pdf":"styles/pdf.css","epub":"styles/epub.css","mobi":"styles/mobi.css","ebook":"styles/ebook.css","print":"styles/print.css"},"showLevel":false},"anchorjs":{}},"theme":"default","pdf":{"pageNumbers":true,"fontSize":12,"fontFamily":"Arial","paperSize":"a4","chapterMark":"pagebreak","pageBreaksBefore":"/","margin":{"right":62,"left":62,"top":56,"bottom":56}},"structure":{"langs":"LANGS.md","readme":"README.md","glossary":"GLOSSARY.md","summary":"SUMMARY.md"},"variables":{},"title":"Neutrino","gitbook":"*"},"file":{"path":"customization/advanced.md","mtime":"2017-05-02T22:44:29.000Z","type":"markdown"},"gitbook":{"version":"3.2.2","time":"2017-05-11T00:08:48.026Z"},"basePath":"..","book":{"language":""}});
|
|
});
|
|
</script>
|
|
</div>
|
|
|
|
|
|
<script src="../gitbook/gitbook.js"></script>
|
|
<script src="../gitbook/theme.js"></script>
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-edit-link/plugin.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-github/plugin.js"></script>
|
|
|
|
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/anchor-js/3.1.1/anchor.min.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-anchorjs/anchor-style.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-npmsearchlist/script.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-search/search-engine.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-search/search.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-lunr/lunr.min.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-lunr/search-lunr.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-sharing/buttons.js"></script>
|
|
|
|
|
|
|
|
<script src="../gitbook/gitbook-plugin-fontsettings/fontsettings.js"></script>
|
|
|
|
|
|
|
|
</body>
|
|
</html>
|
|
|
|
|