执行 npm init 命令 生成 package.json 文件

在 webstorm 项目中局部安装 webpack（比如安装3.6.0版本）

npm install webpack@3.6.0 --save-dev 

在项目文件夹下新建 webpack.config.js 文件

在 webstorm  终端安装 css-loader , style-loader

npm install --save-dev css-loader

npm install --save-dev style-loader

安装之后在 webpack.config.js 文件中配置

最后执行 npm run build 打包

如果打包不成功，需要检查css-loader , style-loader 版本问题

 

webpack配置css-loader的更多相关文章

  1. webpack配置css浏览器前缀

    webpack打包时,css自动添加浏览器前缀.我们需要用到一个Loader:postcss-loader,和一个插件:autoprefixer 安装 npm i postcss-loader aut ...

  2. webpack配置css相关loader注意先后顺序

    一.问题描述 在webpack3中,引入animate.css失败. 二.问题分析 1.难道是入口main.js引用方式不对? import animate from 'animate.css' 2. ...

  3. webpack配置常用loader加载器

    webapck中使用loader的方法有三种 使用loader之前必须运行安装 : npm install --save-dev xxx-loader (1)通过CLI : 命令行中运行 webpac ...

  4. storybook配置之基本配置和webpack配置

    默认配置 Storybook有一个默认的适合(suits)大型项目开发的webpack配置,假如你使用react app,他类似于创建一个react app的配置,并经过调整(tweaked ),使其 ...

  5. webpack配置根据浏览器自动添加css前缀的loader

    1.安装 postcss-loader autoprefixer npm install postcss-loader autoprefixer --save-dev 2.配置webpack.conf ...

  6. Webpack的详细配置，[Webpack中各种loader的安装配置]

    在使用webpack的时候,你是不是被以下这种报错所困扰: 注意看 黄色框中标注的 You may need an appropriate loader to handle this file typ ...

  7. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em，rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  8. webpack导入css及各项loader

    1. webpack导入css 1) 下载相关的加载器 npm install style-loader css-loader -D 2)将index.css引入到mian.js中 import '. ...

  9. webpack css loader 使用

    备注:   接上面的项目 1. 添加css  main.css #app { text-align:center; } main.js require("./main.css"); ...

  10. webpack 配置之入门二（css 篇）

    在项目中我们通过 css 来美化页面,css 也成为了网站不可或缺的一部分,这章节主要介绍 webpack 处理 css 部分, 1.webpack 处理 css 在 webpack 中,我们通过 s ...

随机推荐

  1. 从执行上下文角度重新理解.NET(Core)的多线程编程[2]：同步上下文

    一般情况下,我们可以将某项操作分发给任意线程来执行,但有的操作确实对于执行的线程是有要求的,最为典型的场景就是:GUI针对UI元素的操作必须在UI主线程中执行.将指定的操作分发给指定线程进行执行的需求 ...

  2. Java之 函数（五）

    第一部分 : IDEA开发工具 1.数组 1.1 数组介绍 ​ 数组就是存储数据长度固定的容器,存储多个数据的数据类型要一致. 1.2 数组的定义格式 1.2.1 第一种格式 ​ 数据类型[] 数组名 ...

  3. Luogu P2656 采蘑菇

    尽管是缩点的习题,思路也是在看了题解后才明白的. 首先,每个强连通分量内的点都是一定互通的,也就是可以完全把这里面的边都跑满,摘掉所有能摘的蘑菇.那么,考虑给每一个强连通分量化为的新点一个点权,代表摘 ...

  4. 2016湖南省赛 A 2016 题解(同余)

    题目链接 题目大意 给出正整数 n 和 m,统计满足以下条件的正整数对 (a, b) 的数量: 1<=a<=n 1<=b<=m a*b%2016=0 题目思路 我本来以为是容斥 ...

  5. HEXO & CARDS主题进阶配置

    我想对于建立一个网站而言,第一步要能够做到正常在线访问以及定期产出一定的内容, 其实当网站建立好那一刻,这第一步已经算是完成了,不过我在此基础之上做了些扩展 在默认的card主题之上,我设置了标签.分 ...

  6. 区块链V1版本实现之三

    部分程序代码(区块链的定义及遍历打印): 1 //创建区块链,使用Block数组模拟 2 type BlockChain struct { 3 Blocks []*Block 4 } 5 6 //实现 ...

  7. java43

    自定义日期格式 import java.text.DateFormat; import java.text.ParseException; import java.util.Date; public ...

  8. Spring Cloud Alibaba 初体验(一) Nacos 配置中心

    一.Nacos 下载与初始化配置 本文使用1.2.0,下载地址:https://github.com/alibaba/nacos/releases Nacos 单机模式支持持久化配置到 MySQL 数 ...

  9. 20200428_在centos7.2上挂载ntfs和备份文件到移动硬盘

    [root@localhost ~]# fdisk -l 磁盘 /dev/sda:2000.4 GB, 2000398934016 字节,3907029168 个扇区 - 设备 Boot Start ...

  10. day4(编写注册接口)

    1.编写注册接口 1.1 user/urls.py中添加路由 urlpatterns = [    path('register/', views.RegisterView.as_view()),  ...