做一个练手小项目,基于 react-transform-boilerplate 的demo。
- 克隆 react-transform-boilerplate项目
- 装包
- package.json中的包
- style-loader,css-loader,autoprefixer-loader,sass-loader,node-sass
- 配置webpack.config.dev.js
- 增加main.scss文件
- 在App.js中引入
最后一步出现问题。一旦写入
import './style/main.scss';
就会报错:
dlopen “no suitable image found … did found.. “
重新装包,无效;
把node版本换位课程中的版本,无效。
nvm alias default v5.1.1
谷歌之,在stackoverflow上发现类似问题
最后解决方法
先清除node_modules
rm -rf node_modules
再重装
cnpm i
cpm i -D style-loader css-loader autoprefixer-loader sass-loader node-sass
问题得以解决
配置 webpack.config.dev.js
module: {
loaders: [
{
test: /\.js$/,
loaders: ['babel'],
include: path.join(__dirname, 'src')
},
{
test: /\.scss$/,
loader: 'style!css!autoprefixer!sass'
}]
}
添加sass文件后引入
import './style/main.scss';
成功。