我正在尝试将所有css解压缩到一个文件中,我使用webpack2并且我有extract-text-webpack-plugin@2.0.0-rc.0,以下是我的代码
的WebPack
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
entry: './app/main.ts',
output: {
path: './dist',
filename: 'app.bundle.js'
},
module: {
rules: [
{ test: /\.ts$/, exclude: /node_modules/, use: ['ts-loader'] },
{ test: /\.css$/, use: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader', publicPath: "./dist" }) }
]
},
resolve: {
extensions: ['.js', '.ts']
},
plugins: [
new HtmlWebpackPlugin({
template: './index.html',
minify: {
collapseWhitespace: true
},
}),
new ExtractTextPlugin({
filename: 'style.css',
disabled: false,
allChunks: true
})
]
};
的package.json
{
"name": "angular-quickstart",
"version": "1.0.0",
"description": "QuickStart package.json from the documentation, supplemented with testing support",
"keywords": [],
"author": "",
"license": "MIT",
"devDependencies": {
"css-loader": "^0.28.0",
"extract-text-webpack-plugin": "^2.0.0-rc.0",
"html-webpack-plugin": "^2.28.0",
"style-loader": "^0.16.1",
"ts-loader": "^2.0.3",
"tslint": "^3.15.1",
"typescript": "~2.0.10",
"typings": "^2.1.1",
"webpack": "2.2.1"
},
"repository": {}
}
main.ts
require('../app/content/custom.css');
import 'core-js';
import 'reflect-metadata';
import 'zone.js/dist/zone';
import { enableProdMode } from '@angular/core'
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
platformBrowserDynamic().bootstrapModule(AppModule);
当我尝试运行webpack时,我收到以下错误
我正在按照本教程构建webpack webpack tutorial
答案 0 :(得分:0)
首先,您可以安全地从const webpack = require('webpack')
中删除webpack.config.js
,但这不是必需的:)
你可以试着没有publicPath: './dist'
&& use: ['css-loader']
中的use: 'css-loader'
代替ExtractTextPlugin.extract()
?