2 lukang520 lukang520 于 2017.01.05 17:50 提问

webpack 打包 angular 的问题

我要死了,真的,调试了一天了
打包完美运行
angular已经全局设置,可以用
就是没办法在js里面调用 angular
可以在HTML里面调用angular
你说奇怪不奇怪

 var CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin");
var path = require('path');
var webpack = require('webpack');
var fs = require('fs');
var uglifyJsPlugin = webpack.optimize.UglifyJsPlugin;
var srcDir = path.resolve(process.cwd(), 'src');

//获取多页面的每个入口文件,用于配置中的entry
function getEntry() {
    console.log('srcDir:' + srcDir);
    var jsPath = path.resolve(srcDir, 'js');
    var dirs = fs.readdirSync(jsPath);
    var matchs = [], files = {};
    dirs.forEach(function (item) {
        matchs = item.match(/(.+)\.js$/);
        if (matchs) {
            files[matchs[1]] = path.resolve(srcDir, 'js', item);
        }
    });
    return files;
}

module.exports = {
    cache: true,
    devtool: "source-map",
    entry: getEntry(),
    output: {
        path: path.join(__dirname, "dist/js/"),
        publicPath: "dist/js/",
        filename: "[name].js",
        chunkFilename: "[chunkhash].js"
    },
    module: {
        loaders: [
            {
                test: require.resolve(srcDir + '/js/lib/angular-1.5.8.js'),
                loader: "exports?window.angular"
            }//对于非模块化的库,可以通过exports插件暴露出全局变量,如angular
        ],
        //配置webpack直接忽略不解析该文件的依赖关系。对于比较大的库很有用,如reactjs.主要提高打包速度。
        noParse: [
            srcDir + '/js/lib/angular-1.5.8.js'
        ]
    },
    resolve: {
        alias: {
            jquery: srcDir + "/js/lib/jquery.min.js",
            angular: srcDir + "/js/lib/angular-1.5.8.js",
            Config: srcDir + "/js/lib/config.js",
            core: srcDir + "/js/core",
            ui: srcDir + "/js/ui"
        }
    },
    plugins: [
        //提供全局的变量,在模块中使用无需用require引入
        new webpack.ProvidePlugin({
            jQuery: "jquery",
            angular: "angular",
            $: "jquery",
            Config: "Config"
        }),
        new CommonsChunkPlugin('common.js'),
        new uglifyJsPlugin({
            compress: {
                warnings: false
            }
        })
    ]
};
 console.log(angular);
$('body').append('<a>index</a>');
var app = angular.module('myApp', []);
app.controller('lukang', function($scope) {
    $scope.firstName = "John";
    $scope.lastName = "Doe";
});

index.js:2 Error: [$injector:unpr] http://errors.angularjs.org/1.5.8/$injector/unpr?p0=tProvider%20%3C-%20t%20%3C-%20lukang

报错这个

要不就是 t.module is not 这个错 哎

2个回答

lukang520
lukang520   2017.01.05 17:51

坐等大神来救我!!坐等大神来救我!!坐等大神来救我!!坐等大神来救我!!

Tsapi
Tsapi   2017.02.08 11:57

new webpack.optimize.UglifyJsPlugin({
sourceMap: false,
mangle: false,
compress: {
warnings: false
},
})
把mangle 设置成false即可

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!