我有问题的Browserify Angular配置文件,其中我的require()
HTML模板。我试着生成stringify
或browserify-ng-html2js
在transform()
,但在这种情况下,我有多个转换调用在gulp文件,我不能使它没有错误。捆绑给予者也有错误。
APP.js:
import angular from 'angular';
import appModule from './config/config'
angular.bootstrap( document, [ appModule.name ] );
Config.js:
import angular from 'angular';
import uiRouter from 'angular-ui-router';
const app = angular.module( 'app', [ uiRouter ] );
app.config(( $stateProvider, $urlRouterProvider, $locationProvider ) => {
$urlRouterProvider.other( '/' );
$stateProvider
.state( 'todos', {
url: '/',
template: require( '../views/todos.html' )
} )
.state( 'about', {
url: '/about',
template: require( '../views/about.html' )
} );
$locationProvider.html5Mode( true );
});
export default app;
and Gulp Browserify Task:
/** Browserify TASK **/
gulp.task( 'browserify', function () {
let bundler = browserify({
entries: [ config.sourceDir + 'app.js' ],
debug: true
});
util.log( '-> Compile JS...' );
//Grab files
return bundler
.transform( 'babelify', { presets: [ "es2015", "react" ] } )
.bundle()
.on('error', function (err) {
console.error(err);
this.emit('end');
})
.pipe( source( 'bundle.js' ) )
.pipe( buffer() )
.pipe( sourcemaps.init({ loadMaps: true }) )
.pipe(uglify())
.pipe( sourcemaps.write( './' ) )
//Dest
.pipe( gulp.dest( config.buildDir ) )
} );
现在当我尝试浏览APP时,我得到错误:
Error: Cannot find module 'todos/todos.html'
任何提示和帮助将不胜感激:)谢谢和问候!
p。我试过:
.transform( stringify, {
appliesTo: { includeExtensions: [ 'html', 'htm', 'jsp' ] },
minify: true
} )
我解决了:有两个选项可以解决这个问题:
首先是需要()HTML文件通过browserify,而不是像JS那样使用它们,我们需要安装一个transform -> npm i - d html2js-browserify并将其附加到gulpfile:
.transform( 'html2js-browserify' )
第二个选项是将所有视图复制到public/static dir中,我们在express中设置为提供所有静态文件,并使用templateUrl: <path-to-template-inside-public-dir>
,我希望它对任何人都有帮助。的问候!