Auto import loader for webpack
Installation
npm install auto-import-pkg-loader --save-dev
Examples
To automatically import a lib
test: /\.jsx$/ exclude: /node_modules/ use: loader: 'auto-import-pkg-loader' options: rules: import: 'import React from "react"'
To automatically import all scss files that are in the same dir.
Simple
|- component1
|- index.js <== import "styles.scss"
|- styles.scss
|- component2
|- index.js <== import "styles.scss"
|- styles.scss
No need to manually do import './styles.scss'
in index.js
anymore.
The import will only be added if the file is found
test: /\.js$/ exclude: /node_modules/ use: loader: 'auto-import-pkg-loader' options: rules: local: test: /\.scss$/
Advanced
|- component1
|- styles
|-- custom.css
|-- index.js <== import "./index.scss"; import "./styles/custom.css"
|-- index.scss
|-- index.png
|-- styles.scss
|- component2
|- index.js
|- index.scss <== import "./index.scss"
test: /\.js$/ exclude: /node_modules/ use: loader: 'auto-import-pkg-loader' options: rules: local: // Default. Same dir path: './' // Same name. resource & file have: base, ext & name properties resourcebase === filebase // Scss file test: /\.scss$/ // Default `import "./";` local: path: './styles' test: /\.css$/
To automatically import a config file
test: /\.js$/ exclude: /node_modules/ use: loader: 'auto-import-pkg-loader' options: rules: local: path: path test: /^application\.js$/
Send some love
You like this package?